{"id":1073,"date":"2023-06-15T05:00:00","date_gmt":"2023-06-15T12:00:00","guid":{"rendered":"https:\/\/www.angulartraining.com\/daily-newsletter\/?p=1073"},"modified":"2023-06-14T17:08:21","modified_gmt":"2023-06-15T00:08:21","slug":"new-control-flow-rfc","status":"publish","type":"post","link":"https:\/\/www.angulartraining.com\/daily-newsletter\/new-control-flow-rfc\/","title":{"rendered":"New control flow RFC"},"content":{"rendered":"\n

One of the major announcements on day 1 of ng-conf<\/a> was the control flow request for comments (RFC)<\/a>.<\/p>\n\n\n\n

We’re all familiar with ngFor<\/code>, ngIf<\/code>, ngSwitch<\/code>, and their syntaxes can get tricky at times.<\/p>\n\n\n\n

Now what if ngIf<\/code> was replaced with:<\/p>\n\n\n

\n
\"\"<\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

And what if the new syntax supported much more than ngIf<\/code>, such as else if<\/code> and even readable else<\/code> cases:<\/p>\n\n\n

\n
\"\"<\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

The goal of the Angular team is to introduce syntaxes that are closer to regular Javascript and remove the need for these structural directives.<\/p>\n\n\n\n

for<\/code> loops would look like this and even support a empty<\/code> template. All current ngFor<\/code> local variables<\/a> would be available automatically with no need for variable aliasing<\/a>, too:<\/p>\n\n\n

\n
\"\"<\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

Finally, ngSwitch<\/code> would become the following:<\/p>\n\n\n

\n
\"\"<\/figure>\n<\/div>\n\n\n

<\/p>\n\n\n\n

Angular CLI would perform the syntax updates throughout your Angular code, so there is no need to worry about rewriting those templates. You can find all the reasons why the Angular team decided on these syntaxes compared to other options in the RFC<\/a>. You’re, of course, welcome to add your comments and suggestions to the list.<\/p>\n","protected":false},"excerpt":{"rendered":"

One of the major announcements on day 1 of ng-conf was the control flow request for comments (RFC). We’re all familiar with ngFor, ngIf, ngSwitch, and their syntaxes can get tricky at times. Now what if ngIf was replaced with: And what if the new syntax supported much more than ngIf, such as else if […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,7],"tags":[],"class_list":["post-1073","post","type-post","status-publish","format-standard","hentry","category-angular","category-template-syntax"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts\/1073","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/comments?post=1073"}],"version-history":[{"count":2,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts\/1073\/revisions"}],"predecessor-version":[{"id":1079,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/posts\/1073\/revisions\/1079"}],"wp:attachment":[{"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/media?parent=1073"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/categories?post=1073"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.angulartraining.com\/daily-newsletter\/wp-json\/wp\/v2\/tags?post=1073"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}