Angularjs - set view value is not updating display

Question

I got an input directive that should allow users to undo.

Enter saves the value using some function, Esc Cancel edits from the last save.

For the Esc keypress event i'm using ngmodel.$setViewValue(scope.last_saved_value) but the input is not updating. I know from the docs that this function does not trigger $digest so i put it in an $apply but it is still not working.

JSBIN example

Solution 1

I usually both include and require the ngModel:

app.directive('cancelableInput', function($timeout) { 
  return { 
    restrict : "A",
    require : 'ngModel', 
    scope: {
      ngModel: '=?'
    },

Then, when you want to change the model value and have it update, you can just do:

scope.$apply(function() {
  scope.ngModel = scope.last_saved_value;
});

Solution 2

Try calling ngmodel.$render(); after you do $setViewValue, it should help.

Comments

[haki]

Hey @dave. I guess the key here is the two way binding ? i mean, i was probably (though it really makes no sense) updating a local copy of the ng-model ?

[Carlos Garcia]

I thought the $render method should be implemented by the developer, but I guess that only applies for custom controls. Calling it for inputs (type="checkbox" and type="text" in my case) works perfectly. Thanks.