2
사용자 정의 html과 스크립트 문자열을 반환하는 api endpoint가 있습니다. angular2에게 안전한 html로 알려주고 컴포넌트 템플릿으로 렌더링해야합니다. 지금까지 내 코드 : 내 템플릿에서angular2 구성 요소에 사용자 정의 스크립트를 삽입하십시오.
import { Component } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
@Component({
selector: 'my-app',
templateUrl: './app.template.html',
})
export class AppComponent {
public htmlToRender: any;
constructor(
private _sanitizer: DomSanitizer,
) {}
public ngOnInit(): void {
const html = `
<p>Hello</p>
<p id="a"></p>
<script>
document.getElementById("a").innerHTML = "World"
console.log(111);
</script>
`;
this.htmlToRender = this._sanitizer.bypassSecurityTrustHtml(html);
}
}
나는이 :
'<div [innerHTML]="htmlToRender"></div>'
그러나이 작동하지 않습니다. HTML 및 스크립트 태그는 템플릿으로 렌더링되지만 스크립트는 실행되지 않습니다.