13. Zone.js with Miško Hevery
Why Stack Overflow recommends it
Stack Overflow users link it when they need the original explanation of what Zone.js intercepts and why Angular 2 relies on it for change detection.
Recommended by 1 people across 2 different months, 2015 to 2016.
What it is
A 44-minute interview in which Miško Hevery, creator of AngularJS and a lead on Angular 2, explains Zone.js, the library that patches browser async APIs so frameworks can track when asynchronous work starts and finishes. It was published in December 2015 on the VelvetRose channel.
What people said
Recommends Mark Rajcok · 2015-12 · Stack Overflow · on “ngFor not updating when @Input updated from google map marker event”
From the User Input dev guide [LINK] : Angular only updates the bindings (and therefore the screen) if we do something in response to asynchronous events such as keystrokes. I'm guessing you don't have an asynchronous event when the markers array is updated, hence nothing is causing Angular to run its change detection algorithm. Update: The issue was not that there wasn't an asynchronous event, the issue was that the asynchronous event ( google.maps.Marker.addListener() ) is not known by Angular, hence Zone [LINK] does not monkey patch it, hence Angular doesn't run its change detection algorithm when the data changes. The solution is to emit the event inside Zone's run() function: marker.add
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
Cites MatthewScarpino · 2016-01 · Stack Overflow · on “Should I use the NgZone class?”
In AngularJS 2, most zone-related examples and articles center on the zone object and functions like zone.fork and zone.run . For example, this article [LINK] and this video [this video] focus on the zone object. But the AngularJS 2 documentation [LINK] presents a class named NgZone. I'd like to use methods like onTurnStart and onTurnDone , but I can't find any examples of these methods being used. Should I bother using this class at all?
Cites Gary · 2016-10 · Stack Overflow · on “Can I use Angular1 plugin in Angular2 application?”
Check out the Upgrading with The Upgrade Adapter section in angular.io - point 2 and other sections till 8. [LINK] Use angular.umd.js file instead of angular.dev.js or angular.js for 2.x. It supports both angular1 application and angular2 application to run side by side. This way you can use 1.x plugin with angular 1.x application and still run angular 2.x application side by side. You can use Zone.js to merge two way binding between angular 1.x application and 2.x application. But this can be complex and if you are not comfortable with advanced hacks, you should take the answer of using 1.x plugins in 2.x versions. Unless you are ready to port your 1.x plugin to 2.x plugin yourself. Zone.js
Cites Max Koretskyi · 2016-11 · Stack Overflow · on “Can't understand zone.js example”
Here's the code demonstrating zone.js capabilities from here [LINK] : Zone.current.fork({}).run(function () { Zone.current.inTheZone = true; setTimeout(function () { console.log('in the zone: ' + !!Zone.current.inTheZone); }, 0); }); console.log('in the zone: ' + !!Zone.current.inTheZone); The above will log: 'in the zone: false' 'in the zone: true' I don't really understand what is it that zone is doing here and how's it related to intercepting events that this video [this video] talks about. It outputs false the first time because Zone.current.inTheZone is undefined , and since we changed Zone.current.inTheZone = true; that is the value now that is ouputted second time. What's special is zone d