我想使用innerHTML 在运行时将函数绑定到注入的html 中。
我的组件
@Component({
selector: 'my-app',
template: `<div [innerHtml]="myHTML | safeHtml"></div>`,
styleUrls: ['/my-app.css'], encapsulation: ViewEncapsulation.ShadowDom
})
export class MyApp implements OnInit {
myHTML = `<button (click)="clickMe()" type="button" class="btn btn-secondary">+</button>`
constructor() {}
clickMe() {
console.log("Function is binded using the inner html tag")
}
}
我尝试过，但似乎不起作用。我不确定我是否错过了什么。任何帮助表示赞赏
实施safeHtml管道;它不是开箱即用的：
@Pipe({
name: 'safeHtml'
})
export class SafeHtmlPipe implements PipeTransform {
constructor(private sanitizer: DomSanitizer) { }
transform(value: string): any {
return this.sanitizer.bypassSecurityTrustHtml(value);
}
}
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
