DEV Community

Cover image for How to enable the new control flow or defer block in the Angular v17.0.0-next.6?
Madhu Sudhanan P
Madhu Sudhanan P

Posted on

How to enable the new control flow or defer block in the Angular v17.0.0-next.6?

Even though the new Angular control flows or the defer block changes are available on the release v17.0.0-next.6, you cannot directly use them now in your project and will end up with the below error.

error NG5002: Invalid ICU message. Missing ‘}’ 
or 
error NG5002: Unexpected character “EOF”
(Do you have an unescaped “{“ in your template?
Use “{{ ‘{‘ }}”) to escape it.)
Enter fullscreen mode Exit fullscreen mode

To try a new control flow or the defer block now you have to add the below config in the angularCompileroptions.

{
  "angularCompilerOptions": {
    ....
    "_enabledBlockTypes": [
      "if", "switch", "for", "defer"
    ]
  }
}
Enter fullscreen mode Exit fullscreen mode

_enabledBlockTypes is an internal one that will be changed eventually. But for now, it will allow you to play around with the control flows.

You can find the full working sample here.

Feel free to let me know if you have any comments.

Top comments (0)