ng-change function Calling on-load before selecting

Question

Calling ng-change="changeStudentStatus();" function on-load, before selecting options.

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

Script :

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

it should Call when use change the DropDown. whats wrong in my script

If you're on an old version updating might work (https://github.com/angular/angular.js/issues/9867) This is what I found when having a similar problem. Can't find an actual solution at the time, so I'll go with your working answer :) — Mathieu Brouwers, May 02 '18 at 13:36

score 1 · Accepted Answer · answered Jan 12 '17 at 08:30

Its calling the changeStudentStatus() eveytime the page loading before select the options.

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

i just resolved the issue with temporary solution, i have to call changeStudentStatus only when user changed the values, so i am creating a temporary variable and storing the earlier value, can performing the logic only when values is changed.

Script:

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

score 0 · Answer 2 · answered May 14 '22 at 21:15

0

I solved by doing this:

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

answered May 14 '22 at 21:15

Leffa

369
4
7

Donniewiko · Answer 3 · 2016-12-28T08:10:56.907

-3

Change

ng-change="changeStudentStatus();"

to

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

The difference is that in your code, you call a method that is called changeStudentStatus(). This method isn't available on the controller.

I assumed that you alliased your controller as ctrl since your other methods/properties are being called with ctrl.*

When you call the method ctrl.changeStudentStatus() you actually call the method that is set on your controller.

edited Dec 28 '16 at 08:10

answered Dec 28 '16 at 07:56

Donniewiko

1,427
1
8
9

What difference in between them .? Can Explain how can i approach this.? – Snopzer Dec 28 '16 at 08:04
Th problem with ` ng-selected="item.id == ctrl.statusId"` when i remove this its working fine,but when keep this calling controller. – Snopzer Dec 28 '16 at 08:31
not sure who is downvoting this answer (and upvoting the question). But my answer is valid for the given question. THat being said. You should provide some more information. you have given us little info regarding your controller, that what you are trying to achive etc. – Donniewiko Dec 28 '16 at 08:58

score -3 · Answer 4 · answered Dec 28 '16 at 08:13

The ng-change expression will be automatically evaluated when you use the method ngModelCtrl.$setViewValue.

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

What you understand from my Question, its already calling automatically. i want to perfrom ng-chang only when user select the dropdown. hope you understand — Snopzer, Dec 28 '16 at 08:15

ng-change function Calling on-load before selecting

4 Answers4