The Angular team announced the release of Angular 18 earlier today. You can read the official announcement for in-depth updates. In the meantime, I thought I would summarize the top 6 highlights of this new version here:
- Control flow syntax is now stable (no more dev preview), including useful warnings when not using the
trackoption properly. - Defer block is also stable (no more dev preview) for lazy-loading Angular templates any way you want. You can read more about
@deferhere, including these tutorials on trigger options, custom triggers, and how to prefetch with @defer. - Zoneless change detection to unlock the full benefits of signal-based components. These diagrams on change detection illustrate how much of a game changer this will be.
- Fallback content for content projection with
ng-content. Here is how to use it to make the default content “Hello” in this example if theselectquery doesn’t return anything:
- New events Observable available on form controls, which returns any event going on in that control, including the different form state properties (valid, pristine, etc.)
- Replaying events with server-side rendering. When using SSR, any user actions that happen before the corresponding Javascript handler is downloaded can be replayed automatically using the provider:
provideClientHydration(withEventReplay())
As always with major versions, there’s more, but this overview of Angular v18 should give you enough to get started.
