<分区>
我想将从服务器检索到的一些 HTML 插入到 angular2 中的 DOM 元素中。我似乎无法找出执行此操作的最佳/正确方法。
我不能只将 {{my_data}} 放入模板中，因为 Angular 2 会自动转义 HTML。
我试图编写一个 html-unsafe 指令，它只是直接为元素的 innerHTML 赋值:
/// <reference path="../../typings/typings.d.ts" />
import {Directive} from 'angular2/angular2';
import {ElementRef} from 'angular2/core';
@Directive({
selector: "[html-unsafe]",
properties: ['htmlUnsafe']
})
export class HtmlUnsafe{
constructor(private elem: ElementRef){
}
set htmlUnsafe(value){
setTimeout(() => {
this.elem.nativeElement.innerHTML = value;
},0);
}
}
所以现在在我的模板中我有类似的东西
<td [html-unsafe]="my_data"></td>
这可行，但我不确定这是执行此操作的正确方法，而且 setTimeout 似乎是一种奇怪的解决方法。如果没有 setTimeout，看起来 this.elem.nativeElement 实际上并不引用 DOM 元素，而是引用某种临时元素。
是否有更“正确”的 angular2 方法来简单地将 HTML 插入 DOM 中？为什么我需要将 DOM 操作包装在 setTimeout 中？