CODEWITHSUNDEEP
angularjsangularjs-directive
harishr
harishr

Reputation: 18065

ngModel binding one key stroke late

I am trying to create a directive. Here is the plunker of the directive: plunker

the ngModel value is one key stoke late than display: e.g. if i have display value "abc" then the ngModel received by ngChange function is "ab".

What i dont understand is.. the value I am printing on screen and the value I am passing to the ngChange both are same ngModel, then how can they have different values??

Please help!!!

EDIT

I am currently receiving the ngChange using '&' its one key stroke late.. but if i receive ngChange using '=' the values are in sync but ngChange is called too many times..

I have updated the plunker to show the issue

Upvotes: 0

Views: 255

Answers (3)

harishr
harishr

Reputation: 18065

the problem is the value to be passed to ng-change should be $viewValue and not $modalValue, because $viewValue not always makes it to $modalValue...

Upvotes: 0

Tim Green
Tim Green

Reputation: 3649

You already have ngModel, why do you still need ngChange? You can use $watch instead.

http://plnkr.co/edit/85Su4Dewc0kpXttuY9sp?p=preview

  $scope.id = 'x';
  $scope.$watch('id', function(newValue, oldValue) {
    $scope.watchedNewValue = newValue;
    $scope.watchedOldValue = oldValue;
  });

Upvotes: 0

AlwaysALearner
AlwaysALearner

Reputation: 43947

To call a function inside the controller or parent scope from inside a directive with isolate scope, you need to pass an object:

<cs-input options="fields.userId" ng-model="abc.userId" 
ng-change="changeFunction(userId)"></cs-input>

JS

return '<input type="text" name="myfield" ' +
        'data-ng-change="ngChange({userId:ngModel})" data-ng-model="ngModel"/>';

Upvotes: 1

Related Questions