如何在angular2 ng-content中显示未转义的HTML？

Question

我有一个modal组件，显示模态弹出窗口并在其上显示已转换的ng-content。

以下是我在modal组件中尝试做的事情：

<modal>{{someHTMLString}}</modal>

当我这样做时，HTML标记被转义并显示（我预期的那样）。

所以我尝试了这个：

<modal [innerHTML]="someHTMLString"></modal>

HTML未转义，但它以某种方式显示在屏幕上，而不是作为已转换的内容，就像<modal>是常规HTML标记一样，并且实际模式显示为空。

如何让ng-content提供未转义的HTML？

Answer 1

  

ng-content允许静态（编译时间分辨率）投影   内容。

您可以使用父div来完成此任务：

@Component({
  selector: 'my-app',
  template: `
      <modal>
        <div [innerHTML]="html"></div>
      </modal>
  `,
})