AngularJS ng-click scheint nicht zu funktionieren

Question

Ich habe eine MD-Select, die in sich eine MD-Option hat. Im md-option-Tag habe ich einen ng-click, der auf meine definierte Funktion zeigt. Das Problem ist, dass es nie zu meiner Funktion kommt, wenn ich auf eine Option in der Liste klicke.

Hier ist mein html:

<div class="panel-body"> 
      <md-select placeholder="{{getIntervalName()}}" ng-model="intervalSelected"> 
      <md-option ng-repeat="item in intervals" value="{{item.name}}" ng-click="changeInterval(item)"> 
       {{item.name}} 
      </md-option> 
      </md-select> 
      <div style="overflow: auto;"> 
       <div id="parentDivChart" style="{{changeWidth()}};height:400px"> 
        <canvas id="bar" class="chart chart-bar" chart-data="datta" 
         chart-labels="labels" chart-options="myoptions" chart-legend="legend"> 
        </canvas> 
       <div tc-chartjs-legend chart-legend="legend"></div> 
       </div> 
       </div> 
      </div> 

Und das ist meine Funktion in der Steuerung definiert:

function changeInterval(item) { 
        console.log("change intervaaaalll"); 
        $scope.default_interval ="day"; 
        intrvl = item.value; 
        setItem("interval", item.value); 
        $scope.loadChart(); 
       }; 

Es schreibt nicht an die Konsole irgendetwas, das bedeutet, es nie meine Funktion erreicht. Hat jemand eine Idee warum?

Vielen Dank im Voraus!

Answer 1

Es wäre besser gewesen, wenn Sie den Code zur Verfügung gestellt hatte wo Sie den Controller erstellen. Aber ich denke, Sie sollten die Methode changeInterval(item) auf diese Weise erstellen:

var nameOfYourApp = angular.module(‘nameOfYourApp’, []); 
nameOfYourApp.controller('nameOfYourController', function($scope) { 
      $scope.changeInterval = function(item) { 
        console.log("change intervaaaalll"); 
        $scope.default_interval ="day"; 
        intrvl = item.value; 
        setItem("interval", item.value); 
        $scope.loadChart();  
      } 
}); 

hoffe, das hilft!

Answer 2

schreiben "$scope.changeInterval=changeInterval;" in Ihrem Controller

oder

Verwendung "$scope.changeInterval=function (item) {...};"

Answer 3

Wie Sie die changeInterval Methode auf dem Umfang Sie es auf den Umfang hinzufügen müssen, verwenden möchten, wie folgt:

In der Steuerung:

$scope.changeInterval(item) { 
        console.log("change intervaaaalll"); 
        $scope.default_interval ="day"; 
        intrvl = item.value; 
        setItem("interval", item.value); 
        $scope.loadChart(); 
       }; 

Vergessen Sie nicht, $ scope als Abhängigkeit für Ihren Controller anzugeben.

Z. B .:

app.controller('myCtrl', function($scope) { 

}); 

Jetzt, da die changeInterval Funktion einer Variablen auf dem Umfang zugeordnet ist, kann es auf der Ansicht aufgerufen werden.

Answer 4

Da Sie changeInterval() eine private Funktion für den Controller ist, können Sie nicht darauf zugreifen. Sie müssen es öffentlich machen (binden Sie es an eine Variable des Controllers).

Sie sollten mit diesem Ansatz gehen:

$scope.changeInterval = changeIntervalapproach; 

Wenn Sie die Ansicht Modellansatz mit controllerAs verwenden dann verwenden:

vm.changeInterval = changeInterval;