angularjs - ng-change 功能在选择之前调用加载

Question

调用 ng-change="changeStudentStatus();" 在选择选项之前加载功能。

<md-select ng-model="ctrl.newStudentStatus" ng-change="changeStudentStatus();" ng-if="ctrl.studentStatusList" >
   <md-option class="ss-options" ng-value="item.display_name" ng-repeat="item in ctrl.studentStatusList" ng-selected="item.id == ctrl.statusId">{{item.display_name}}</md-option>
</md-select> 

脚本 ：

$scope.changeStudentStatus = function(){
     //some logic  
};

它应该在使用更改下拉菜单时调用。我的脚本有什么问题

Answer 1

在选择选项之前，它会在页面加载时调用 changeStudentStatus()。

<md-select ng-model="ctrl.newStudentStatus" ng-change="changeStudentStatus();" ng-if="ctrl.studentStatusList" >
   <md-option class="ss-options" ng-value="item.display_name" ng-repeat="item in ctrl.studentStatusList" ng-selected="item.id == ctrl.statusId">{{item.display_name}}</md-option>
</md-select> 

我刚刚用临时解决方案解决了这个问题，我必须在用户更改值时调用 changeStudentStatus，所以我创建一个临时变量并存储早期的值，只有在值更改时才能执行逻辑。

脚本：

$scope.newValue  =ctrl .newStudentStatus;
        $scope.changeStudentStatus = function(){
              if($scope.oldVlaue === $scope.newValue)
              {
                //some logic  
              }
        };

Answer 2

改变

ng-change="changeStudentStatus();" 

到

ng-change="ctrl.changeStudentStatus();"

不同之处在于，在您的代码中，您调用了一个名为 的方法changeStudentStatus()。此方法在控制器上不可用。

我假设您已将您的控制器与您的控制器联系起来，ctrl因为您的其他方法/属性正在被调用ctrl.*

当您调用该方法时，ctrl.changeStudentStatus()您实际上调用的是在您的控制器上设置的方法。

Answer 3

当您使用方法 ngModelCtrl.$setViewValue 时，将自动评估 ng-change 表达式。

angular.module("myApp").directive("mdselect", function(){  return {
require:"^ngModel", // this is important, 
scope:{      ... // put the variables you need here but DO NOT have a variable named ngModel or ngChange 
}, 
link: function(scope, elt, attrs, ctrl){ // ctrl here is the ngModelCtrl
  scope.setValue = function(value){
    ctrl.$setViewValue(value); // this line will automatically eval your ng-change
  };
}};});