source

AngularJS를 사용할 때 페이지에 표시하기 위해 곱슬곱슬한 괄호를 피하는 방법은 무엇입니까?

lovecheck 2023. 2. 9. 22:46
반응형

AngularJS를 사용할 때 페이지에 표시하기 위해 곱슬곱슬한 괄호를 피하는 방법은 무엇입니까?

사용자에게 이중 물결 괄호를 보여주고 싶지만 Angular는 자동으로 바인드합니다.페이지 로드 시 바인딩에 사용되는 물음표를 표시하지 않는 경우와는 반대입니다.

사용자에게 다음 내용을 보여 줍니다.

My name is {{person.name}}.

하지만 Angular가 대체됨{{person.name}}가치를 가지고 있습니다.이것이 효과가 있을 것으로 생각했지만 각도가 여전히 값으로 대체됩니다.

{{person.name}}

Pluker: http://plnkr.co/edit/XBJjr6uR1rMAg3Ng7DiJ

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

매뉴얼 @ ngBindable Bindable

편집: 따옴표 안의 괄호 사이에 \slash를 추가하는 것은 기능합니다.

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

이것도..by pass 각도 해석

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

이것도..

{{ person.name }<x>} 

{{ person.name }<!>}

이 경우 자리 표시자에 곱슬 괄호를 표시하고자 하므로 HTML 속성 내에 표시되어야 합니다.사용방법:

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

보시는 바와 같이, 우리는 곱슬곱슬한 괄호를 분리하기 위해 3개의 작은 끈으로 줄을 만들고 있습니다.

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

이를 통해 를 사용하지 않게 됩니다.ng-non-bindable계속 사용할 수 있도록ng-Atribute를 지정합니다.

Angular 9에 대해 업데이트됨

사용하다ngNonBindable보간 구속에서 벗어나기 위해서요

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

사용하다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>

텍스트에 단일 괄호를 붙이고 싶었지만 위의 솔루션은 나에게 맞지 않았습니다.앵귤러도 추천해주길 원했어요.

각도 버전: 5

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

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

도움이 됐으면 좋겠어요.

Angular 컴파일러에서:

Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.)

그래서 첫 번째 질문에서는 다음과 같이 끝납니다.

My name is {{ '{' }}{{ '{' }}person.name{{ '}' }}{{ '}' }}

언급URL : https://stackoverflow.com/questions/16868024/how-do-i-escape-curly-braces-for-display-on-page-when-using-angularjs

반응형