10 What’s next in modern Angular?

 

This chapter covers

  • New template syntax
  • Built-in conditional expressions in templates
  • Deferred views and advanced lazy loading of components
  • Change detection in depth
  • Building zoneless applications

So far, almost everything we have discussed has involved stable, ready-to-use modern tools provided by the Angular team for cutting-edge solutions. Now, in this last chapter, it is time to enter the experimental realm and discuss the direction that the Angular framework will be taking in the near future and the features that are currently available for us in the “developer preview” status. Let’s begin!

10.1 New template syntax

We have already built and deployed not one but two modern Angular applications, and now we are in the sweet period of maintaining that application. Of course, maintaining it means following the new releases of all dependencies (framework, libraries, build tools, and so on) and trying our best to keep our application as up-to-date as possible.

If we had started the HRMS application when Angular v16 was the latest version, then by the time of this book’s release it would have already had two newer versions: v17 and v18, which brought with them some powerful new features. In fact, we have already discussed things from v17 in previous chapters [mainly things in relation to server-side rendering (SSR)], but there is more to explore.

10.1.1 Goodbye ngIf!

10.1.2 Hello @for!

10.1.3 @switch

10.1.4 Migrating to the new template syntax

10.2 Deferrable views

10.2.1 Deferring a simple component

10.2.2 Deferring depending on a condition or trigger

10.2.3 Customizing deferred loading

10.3 Zoneless Angular applications

10.3.1 How change detection works in Angular

10.3.2 Why change detection in Angular needs to improve

10.3.3 ChangeDetectionStrategy.OnPush

10.3.4 Introducing granular change detection

10.3.5 Zoneless scheduler for change detection

10.4 In other news

Summary