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, 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 were using the setTimeout() method in your Angular component, it would trigger an Angular change detection each time its callback method was called. In this recipe, you'll learn how to execute code blocks outside of the ngZone service, using the runOutsideAngular() method.

Getting ready

The project for this recipe resides in Chapter12/start_here/run-outside-angula:

1. Open the project in VS Code.
2. Open the terminal and run npm install to install the dependencies of the project.
3. Run the ng serve...