Warum scheint mein Angular-Code zurückzusenden?

Question

Ich versuche, einen ersten Aufruf an die Datenbank zu machen, um einige Dropdown-Listen zu laden, und von diesem Punkt an wird alles durch AJAX erledigt. Wenn ich auf eine Schaltfläche auf der Seite klicke, scheint sie zurückzuschicken. Wenn ich in Fiddler sehe, sehe ich einen Aufruf an die Funktion, die jedes Mal, wenn ich auf die Schaltfläche klicke, die Werte für das Dropdown-Feld abruft.

(function() { 
angular.module('customModuleApp', []) 
.controller('customModuleCtrl', ['$scope', '$http', function ($scope, $http) { 
    $scope.frequencies = []; 
    $scope.users = [ 
     { 
      Name: 'Tom', 
      Address: '123 main', 
     }, 
     { 
      Name: 'Bob', 
      Address: '124 main', 
     } 
    ]; 
    $(document).ready(function() { 
      $http({ 
       method: 'POST', 
       url: 'Page.aspx/GetFrequencies', 
       headers: { 
        'Content-Type': 'application/json;charset=utf-8' 
       }, 
       data: {} 
      }).success(function (data) { 
       $scope.frequencies = data.d; 
       $scope.selected = $scope.frequencies[0]; 
      }).error(function (jqXhr, status, errorThrown) { 
       alert('Error: ' + errorThrown); 
      }); 
    }); 


    $scope.addModule = function() { 
     try{ 
      alert('module added!'); 
      return false; 
     } catch (e) { 
      alert(e.message); 
     } 

    }; 
    $scope.updateModule = function() { 
     try { 
      alert('module updated!'); 
      return false; 
     } catch (e) { 
      alert(e.message); 
     } 

    }; 
    $scope.removeModule = function() { 
     try { 
      alert('module removed!'); 
      return false; 
     } catch (e) { 
      alert(e.message); 
     } 

    }; 
}]) 
.directive('moduleForm', function() { 
    return { 
     restrict: 'E', 
     templateUrl: '../../Templates/module-form.html' 
    } 
}); 
})(); 

HTML

    <div style="margin:0 auto;position:relative;width:500px;"> 
        <div style="background:url('../../Images/rg_header_bg.png') repeat-x #718CA1;border: 1px solid #3d556c;border-radius:10px 10px 0 0;height:24px;"></div> 
        <div class="gridHeader" style="width:50%;">This is a test</div> 
        <div class="gridHeader" style="width:50%;right:0;">To create a reusable template</div> 
       </div> 
       <div style="margin:0 auto;background-color:#fff;width:500px;position:relative;" ng-app="customModuleApp"> 
        <div ng-controller="customModuleCtrl"> 
         <module-form></module-form> 
        </div> 
       </div> 
      </div> 

Und die "Modul-Form" Richtlinie html: Modulname: Frequenz:

</table> 
    <hr style="background-color:gray;height:1px;width:100%;text-align:left;" /> 
    <table> 
     <tr><td>Table Column Name</td><td><input type="text" /></td></tr> 
     <tr><td>Meter Attribute</td><td><input type="text" /></td></tr> 
     <tr> 
      <td> 
       <button style="background-color:transparent;border:none;" ng-click="addModule();"> 
        <img src="../Images/functionbuttons/add_button.png" alt="" /> 
       </button> 
      </td> 
      <td> 
       <button style="background-color:transparent;border:none;" ng-click="updateModule();"><img src="../Images/functionbuttons/edit_button.png" alt="" /></button>&nbsp; 
       <button style="background-color:transparent;border:none;" ng-click="removeModule();"><img src="../Images/functionbuttons/delete_button.png" alt="" /></button> 
      </td> 

     </tr> 
    </table> 

</form> 

Was bin ich hier? Warum wird die Funktion GetFrecies aufgerufen, wenn ich auf eine der Schaltflächen zum Hinzufügen/Bearbeiten/Löschen klicke? Könnte es sein, dass sich dies in einem Inhaltssteuerelement auf einer ASP.Net-Masterseite befindet?

Answer 1

Wenn Sie es einmal aufrufen müssen, kapseln Sie Ihren Ajax-Aufruf innerhalb einer JavaScript-Funktion, wie unten gezeigt.

$scope.getFrequencies= function() { 
       //your ajax method 
      }; 

$scope.getFrequencies(); 

Entfernen Sie das unten erwähnte Code-Snippet vollständig und tun Sie wie oben erwähnt.