Is there a simple way to show curly brackets symbol in Angular?
like following:
<div>{{hello curly brackets symbol}}</div>
I can use innerText to solve this issue. but maybe have another better way to do.
<div [innerText]="'{{hello curly brackets symbol}}'"></div>
>Solution :
Yes, your approach using [innerText] is one way to display curly brackets as text in Angular templates. Another approach is to use the HTML entity for curly brackets, which is { for { and } for }. Here’s how you can use it:
{{ ‘{’ }}hello curly brackets symbol{{ ‘}’ }}
This will render as:
{hello curly brackets symbol}
Using HTML entities can be useful if you have many instances of curly brackets you need to display as text and want to avoid using [innerText] repeatedly.