how does the Angular Js handle data binding with view and event triggered with controller?

Question

If a ng-model changed in View, the $scope will be updated correspondingly, but if there is a {{x()}} in the View and a $scope.x=function(){} in the js part, is it that when any event or stuff happens in the view, the x() will be triggered?

I am not quite clear about the principle of AngularJs' event and functioning.

Alexander Puchkov · Accepted Answer · 2014-01-30 03:49:47Z

1

Most of the times Angular will properly handle $scope.x=function(){} and update views automatically.

That's because there are only a few moments in application execution time when your code is executed such as page load, AJAX callback etc. Angular knows about such moments and does dirty checking (comparing scope values before and after).

However, there might be times when Angular doesn't aware that you updating scope properties, for example when you integrating with some 3rd party plugins. In such cases you need to wrap your code, which changes scope properties in $scope.$apply method:

$scope.$apply(function(){
    $scope.x = function(){};
});

answered Jan 30, 2014 at 3:49

Alexander Puchkov

5,9934 gold badges38 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ShuSon Over a year ago

TY for quick reply. Let's say this situation, when the value binding with a ng-model <input> changes, it seems the angular will check all the functions in controller and find out the specified method x() and run it, but others are also executed at the same time. This means there are more than two moments you mentioned that angular will check all related controllers

Alexander Puchkov Over a year ago

When input value changes Angular will update bound scope property itself (without calling your $scope.x = function(){} function). Additionally you can listen to scope property change event and update other properties like $scope.$watch('x', function(){$scope.y = ...});

Collectives™ on Stack Overflow

how does the Angular Js handle data binding with view and event triggered with controller?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related