ng-change 函数在选择之前调用 on-load

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  
};

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

Answer 1

改变

ng-change="changeStudentStatus();"

到

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

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

我假设你将你的控制器别名为 ctrl 因为你的另一个 methods/properties 被调用 ctrl.*

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

Answer 2

当您使用方法 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
  };
}};});

Answer 3

每次在 select 选项之前加载页面时都会调用 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 4

我这样做解决了：

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

ng-change 函数在选择之前调用 on-load

ng-change function Calling on-load before selecting

angularjs

material-design

angularjs-select