Find and report more errors than ever with Angular 9’s Ivy compiler, strict template checking.
Brought to you by John Papa
Please let us know if you have any questions on this front!
Great article as always 
I am super happy about the strictTemplates improvement. 
Detecting bugs in build time is preferable!
There is a TS issue tho when going all-in with strict configurations and trying to do the input type coercion. Angular has to mitigate it with ngAcceptInputType_* 
TS Issue: Angular
Angular workaround: Angular (nice they thought about it)
Most common example of this is when using async pipe on an @Input of a component.
async pipe will always return T | null, which means if T is boolean, and your component accepts boolean, you will still get “not assignable” error due to the null from async - which is correct btw.
Normally you would then create a setter and getter for that input and coerce the type in a setter, but preserve the intended type of the input in getter, this however doesn’t work in TS (issue above).
John, this is a great write-up (as always). I’m experimenting with it now on some existing projects. One of the things that I’m experiencing is that it complains a lot about types in *ngFor loops if the iterable is of a variable type. For example, if I do something like *ngFor="let person of people" and “people” is defined as Employee[] | Customer[], the compiler complains that the object is not assignable to the expected type. This message is confusing to me because it’s not obvious that I’m doing any “assigning” by the act of iterating through a collection.
Have you had the same experience? This is somewhat problematic for a lot of my projects because I tend to consolate code wherever possible. So I prefer to implement a single method (for example) that accepts a variable type as input, but ultimately does the same thing regardless of the input type.
Thanks Rullo.Dan
I haven’t run into that, but it sounds like a great thing to post in a github issue for the angular team.
Looks like some template code is missing in the first code snippet in app.component.ts . Reference of title and Id is missing there. Otherwise nice and simple article!
1 Like