Angular 17 Control Flow: New Syntax for if, for, and switch in Templates
Angular 17 introduced a powerful new control flow with modern syntax designed to simplify templates. In this video, I introduce you to the built-in syntax for conditional, loop, and switch blocks. Additionally, I'll explain the empty block in the for loop, enabling you to create templates for empty lists, whether they're arrays or objects.
This is the most significant update ever made to ng-templates, created in response to feedback from the community and surveys by the @Angular team.
✔️ If you're used to the old syntax, there's no need to worry. It will still be supported for a long time, but is now deprecated, and developers are encouraged to move to the new syntax.
✔️ I use clear visual examples to show the difference between the old and new syntax, so you can see how much cleaner and more efficient your templates can become.
What you will learn in this video:
0:00 Conditional blocks
0:33 Loop blocks
1:06 The new "empty" block for the for loop
1:24 Switch blocks
1:44 The old syntax
👨💻 Whether you are an experienced Angular developer or just starting out, this update can significantly improve your development experience. Subscribe for more clear and visual tutorials on Angular and modern web development.
Sources:
▪️RFC "Built-In Control Flow": https://github.com/angular/angular/di...
▪️Implement new block syntax: https://github.com/angular/angular/pu...
Follow me on:
▪️Twitter: / theigorsedov
▪️LinkedIn: / igorsedov
▪️Bluesky: https://bsky.app/profile/igorsedov.com
▪️Instagram: / theigorsedov
Website: https://igorsedov.com
Email: [email protected]
#angular #angular17