Change Detection Reinvented Victor Savkin
Why Stack Overflow recommends it
Stack Overflow users link it when answering questions about how Angular 2 change detection works, why it is faster than AngularJS, and how OnPush and markForCheck behave.
Recommended by 4 people across 4 different months, 2015 to 2018.
What it is
A conference talk from ng-conf 2015 in which Victor Savkin of the Angular team explains how change detection works in Angular 2. He covers how it differs from AngularJS dirty checking, including generated change detector classes and component-tree based checking.
What people said
Recommends Mark Rajcok · 2016-01 · Stack Overflow · on “What is the Angular equivalent to an AngularJS $watch?”
In Angular 2, change detection is automatic... $scope.$watch() and $scope.$digest() R.I.P. Unfortunately, the Change Detection section of the dev guide is not written yet (there is a placeholder near the bottom of the Architecture Overview [LINK] page, in section "The Other Stuff"). Here's my understanding of how change detection works: Zone.js "monkey patches the world" -- it intercepts all of the asynchronous APIs in the browser (when Angular runs). This is why we can use setTimeout() inside our components rather than something like $timeout ... because setTimeout() is monkey patched. Angular builds and maintains a tree of "change detectors". There is one such change detector (class) per c
Recommends Sasxa · 2016-02 · Stack Overflow · on “Angular 2 setting a new value does not trigger an input change event”
If you can identify where the problem is and appropriate lifecycle hook where you could solve it, you can let Angular know using ChangeDetectorRef [LINK] . constructor(private _ref: ChangeDetectorRef) method_where_changes_are_overlooked() { do_something(); // tell angular to force change detection this._ref.markForCheck(); } I had a similar issue, only with router - it needed to do redirect when/if API server goes offline. I solved it by marking routerOnActivate() for check... When you trigger change detection this way a "branch" of a component tree is marked for change detection, from this component to the app root. You can watch this talk by Victor Savkin [this video] about this subject...
Recommends nikk wong · 2016-04 · Stack Overflow · on “Why is both reference change and primitive change catch by Angular2 during change detection even with OnPush flag set?”
It must check the object and all of it's properties. This is faster than the angular 1 version though, which would do something like ```oldValue.prop1 === newValue.prop1``` because angular2 creates change detector classes at runtime, which are monomorphic (angular1 checks are polymorphic). Learn more -> [this video]
Recommends Vikas · 2018-09 · Stack Overflow · on “Is Angular4 really 2-Way data-Binding?”
[LINK] whether 2-Way data binding is possible or Not in Angular 2/4/5/6? Nope, it is not [(ngModel)] is not two-way data binding. It’s just a syntactic sugar for a simultaneous event binding and property binding. To Explore more on this 1. Do you really know what unidirectional data flow means in Angular [LINK] 2. Change Detection Reinvented Victor Savkin [this video] 3. TWO-WAY DATA BINDING IN ANGULAR [LINK]
Cites 0xcaff · 2015-12 · Stack Overflow · on “NgFor doesn't update data with Pipe in Angular2”
As Eric Martinez pointed out in the comments, adding pure: false to your Pipe decorator and changeDetection: ChangeDetectionStrategy.OnPush to your Component decorator will fix your issue. Here is a working plunkr. [LINK] Changing to ChangeDetectionStrategy.Always , also works. Here's why. According to the angular2 guide on pipes [LINK] : Pipes are stateless by default. We must declare a pipe to be stateful by setting the pure property of the @Pipe decorator to false . This setting tells Angular’s change detection system to check the output of this pipe each cycle, whether its input has changed or not. As for the ChangeDetectionStrategy [LINK] , by default, all bindings are checked every sin
Cites Mark Rajcok · 2016-06 · Stack Overflow · on “Angular 1.x vs 2 Change detection performance”
Is it just faster in performing dirty checking because of the VM optimized change detectors? It is hard to say, since change detection in Angular 2 is completely different from Angular 1. I think the only thing that is the same is the (logical) concept of dirty checking template bindings. Most likely it is the monomorphic (VM-friendly/optimized) code – Angular blog [LINK] , thoughtram blog [LINK] , V.Savkin talk [this video] – that Angular 2 generates in the change detector objects that it creates for each component. Please have a look at the second plunkr, i just updated it. Now it has a child component which gets the list as an input parameter. As soon as I introduced that, Angular was forced t
Cites Vikas · 2018-03 · Stack Overflow · on “Why Angular(2~5) is way faster than AngularJS”
Table that summarizes the major differences between Angular and AngularJS Change Detection. [LINK] To Explore more on this Change Detection Differences between Angular and AngularJS [LINK] Change Detection Reinvented Victor Savkin [this video] Angular’s $digest is reborn in the newer version of Angular [LINK] The Angular 2 Compiler Tobias Bosch [LINK] The Angular Compiler 4.0 - TOBIAS BOSCH [LINK] .