반응형
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>
반응형
'programing' 카테고리의 다른 글
LaTeX에서 2 열 레이아웃으로 콘텐츠를 표시하는 방법은 무엇입니까? (0) | 2020.09.05 |
---|---|
AngularJS에 현재 사용자 컨텍스트를 어떻게 저장합니까? (0) | 2020.09.05 |
Ruby는 Tail Call 최적화를 수행합니까? (0) | 2020.09.05 |
여러 조건이있는 javascript if 문이 모든 조건을 테스트합니까? (0) | 2020.09.05 |
sqlalchemy 모델의 정의 된 열을 반복하는 방법? (0) | 2020.09.05 |