AngularJS를 사용할 때 페이지에 표시하기 위해 중괄호를 어떻게 이스케이프합니까?

사용자가 이중 중괄호를 보길 원하지만 Angular는 자동으로 바인딩합니다. 이것은 페이지가로드 될 때 바인딩에 사용되는 중괄호를 보지 않으려 는 이 질문 의 반대 사례입니다 .

사용자가 이것을 보길 바랍니다.

My name is {{person.name}}.

그러나 Angular는 {{person.name}}값으로 대체 됩니다. 나는 이것이 효과가 있다고 생각했지만 angular는 여전히 그것을 값으로 대체합니다.

{{person.name}}

플 런커 : http://plnkr.co/edit/XBJjr6uR1rMAg3Ng7DiJ

<code ng-non-bindable>{{person.name}}</code>

문서 @ ngNonBindable

편집 : 따옴표 안에 대괄호 사이에 \ 슬래시 추가

{{  "{{ person.name }\}"   }}  

이것도 .. 패스 각도 해석

{{ person.name }<!---->}

이것도 ..

{{ person.name }<x>} 

{{ person.name }<!>}

우리의 경우 자리 표시 자에 중괄호를 표시하고 싶었 기 때문에 HTML 속성 안에 나타나야했습니다 . 우리는 이것을 사용했습니다.

 <input placeholder="{{ 'Hello {' + '{person.name}' + '}!' }}" ...>

보시다시피 중괄호를 분리하기 위해 세 개의 작은 문자열로 문자열을 구성하고 있습니다.

'Hello {' + '{person.name}' + '}!'

이렇게하면 요소의 다른 위치에서 속성을 ng-non-bindable계속 사용할 수 있도록 사용을 피할 수 있습니다 ng-.

ng-non-bindable컨테이너에서 사용하면 여기 컨테이너 내부의 모든 요소에 효과적입니다.

<div ng-non-bindable>
  <span>{{person.name}}</span>
  <img src="#" alt="{{person.name}}">
  <input placeholder="{{person.name}}">
</div>

<span>{{</span>{{variable.name}}<span>}}</span>

Angular 9 업데이트

ngNonBindable보간 바인딩을 이스케이프하는 데 사용 합니다.

<div ngNonBindable>
  My name is {{person.name}}
</div>

나는 텍스트에 단일 괄호를 원했고 위의 솔루션이 저에게 효과적이지 않았습니다. 그래서 Angular가 권장되기를 원했습니다.

각도 버전 : 5

필수 텍스트 : 내 이름은 {person.name}입니다.

<span>My name is {{'{'}}person.name{{'}'}}.</span>

누군가에게 도움이되기를 바랍니다.