Running async events outside Angular with runOutsideAngular

Angular runs its change detection mechanism on a couple of things, including—but not limited to—all browser events, such as keyup, keydown, click, and so on. It also runs change detection on setTimeout, setInterval, and Ajax HTTP calls. If we had to avoid running change detection on any of these events, we’d have to tell Angular not to trigger change detection on them—for example, if you use the setInterval method in your Angular component, it will trigger an Angular change detection cycle each time its callback method is called. This can lead to a huge amount of change detection cycles and your app might even hang. An ideal situation would be to be able to still use the setInterval method and so on without triggering the change detection. In this recipe, you’ll learn how to do exactly that. You will learn how to execute code blocks outside of zone.js using the NgZone service, particularly...