How to escape single curly braces angular 4 template

Question

I have something like

<div ngNonBindable>
  yada yada.... { ... }  blah blah....
<div>

Even with 'ngNonBindable' directive I get error:

compiler.es5.js:1690 Uncaught Error: Template parse errors:
Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.) ("
<div>

Two things:

1) Please point me in right direction.

2) Or, a workaround please.

Answer 1

You can bind the text to a string literal:

<div>
  {{"yada yada.... { ... }  blah blah...."}}
<div>

(if the text also has quote marks in it, you can escape them with \)

Edit: just saw your comment that you need to keep ngNonBindable. It looks like there's an open issue for that, so until that's fixed you may need to see if you can restructure your markup to remove the escaped text from the ngNonBindable section.