How to escape single curly braces angular 4 template

问题

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.

回答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.

回答2:

You can use Special Character for { --> { and for } --> }

<div>
  yada yada.... &#123; ... &#125;  blah blah....
<div>

回答3:

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

there is a open bug for ngNonBindable

来源：https://stackoverflow.com/questions/45619441/how-to-escape-single-curly-braces-angular-4-template