• My “check” function was defined on the parent scope of the scope that was modified by my ng-model element.
  • According to JavaScript Prototype Inheritance , scopes properties are separated through scopes.
  • Looks like the functions attached to $scope creates a new scope(i.e. in function check() , this refers to a scope that’s a child scope of $scope ).
  • Avoid direct bindings to scope’s properties.
  • Whereas if the child scope creates, it will be added to the parent’s user object so both scopes are pointing to the same object – Will Stern Jun 22 ’15 at 17:02

Seems like I have actually solved that issue (before had to come up with some workarounds) with:
Only had to change my property name from searchText to search.text, then define empty $ = {}; object in the controller and voila… Have no idea why it’s working though ;]

@JavascriptQnA: Ng-model does not update controller value #javascript #angularjs #data-binding #angular-ngmodel

I came across the same issue when dealing with a non-trivial view (there are nested scopes). And finally discovered this is a known tricky thing when developing AngularJS application due to the nature of prototype-based inheritance of java-script. AngularJS nested scopes are created through this mechanism. And value created from ng-model is placed in children scope, not saying parent scope (maybe the one injected into controller) won’t see the value, the value will also shadow any property with same name defined in parent scope if not use dot to enforce a prototype reference access. For more details, checkout the online video specific to illustrate this issue, and comments following up it.


You might also like More from author

Comments are closed, but trackbacks and pingbacks are open.