Angular无法呈现已传递HTML的列表

Question

Angular正在删除按钮

这是我的渲染功能，稍后会通过

这就是我传递给低阶组件的方式     

这是低阶组件的样子

有什么想法吗？

Answer 1

问题在于按钮是潜在的安全问题。 如果您在控制台中查看，角度应打印如下内容：

  

警告：清理HTML会剥离一些内容，请参阅   http://g.co/ng/security#xss

要提供“干净的” HTML，您必须先对其进行清理。 幸运的是，Angular上有一个名为DomSanitizer的类。

TS：

constructor(private sanitizer: DomSanitizer) {}

public getHtml() {
    return this.sanitizer.bypassSecurityTrustHtml(`<span><button>Click</button></span>`);
}

HTML：

<div [innerHtml]="getHtml()"></div>

这应该对您有用。

这里还有一个Stackblitz