In this tutorial, we will learn how ngDoCheck lifecycle hook works. We will find out how to keep track of the changes to @Input properties using the DoCheck hook. We also look at the how key-value differs and Iterable differs works.
I started digging into the Angular 2 Router a year ago when Angular 2 was still just a release-candidate (RC). At the time, the in-built Router had a fatal flaw: it wouldn’t allow <router-outlet> directives to be conditionally rendered in the DOM (Document Object Model). This was a show-stopper for a complex user interface (UI) like InVision App. To get around this, I switched over to the ngRx Router, which worked beautifully. Until the ngRx Router was end-of-lifed. At which point I just gave up and stopped experimenting with routing. Now, over a year later, I wanted to check back in with the Angular 4 Router to see if the situation had improved. And, thankfully it has. Mostly. With Angular 4.4.0, conditional Router outlets now mostly work. “Mostly” in that they are allowed; but, “mostly” in that they do break in certain circumstances.
Angular CLI 1.4.0 is out with some nice new features!
If you want to upgrade to 1.4.0 without pain (or to any other version, BTW), I have created a Github project to help: angular-cli-diff. Choose the version you’re currently using (1.2.1 for example), and the target version (1.4.0 for example), and it gives you a diff of all files created by the CLI: angular-cli-diff/compare/1.2.1…1.4.0. You have no excuse for staying behind anymore!