Angular2에서 원시 HTML을 바인딩하는 방법

Angular2에서 원시 HTML을 바인딩하는 방법

---

이 질문에 이미 답변이 있습니다.

• Angular HTML 바인딩 18 답변

Angular 2.0.0-beta.0을 사용하고 간단한 HTML을 직접 만들고 바인딩하고 싶습니다. 가능하고 어떻게?

나는 사용하려고했다

{{myField}}

그러나 myField의 텍스트는 이스케이프됩니다.

Angular 1.xi의 경우 ng-bind-html에 대한 히트를 찾았지만 2.x에서는 지원되지 않는 것 같습니다.

프랭크

---

innerHTML속성에 바인딩

달성하는 두 가지 방법이 있습니다.

<div [innerHTML]="myField"></div>
<div innerHTML="{{myField}}"></div>

전달 된 HTML을 신뢰할 수있는 것으로 표시하여 Angulars DOM 새니 타이 저가

<div [innerHTML]="myField | safeHtml"></div>

같은 파이프로

@Pipe({name: 'safeHtml'})
export class Safe {
  constructor(private sanitizer:DomSanitizer){}

  transform(value: any, args?: any): any {
    return this.sanitizer.bypassSecurityTrustHtml(value);
    // return this.sanitizer.bypassSecurityTrustStyle(style);
    // return this.sanitizer.bypassSecurityTrustXxx(style); - see docs
  }
}

RC.1에서 바인딩 구문을 사용하여 일부 스타일을 추가 할 수 없음을 참조하십시오.

참고 URL : https://stackoverflow.com/questions/34585453/how-to-bind-raw-html-in-angular2