pipe - 如何允许 html 返回 angular2 管道？

Question

我有一个返回 html 字符串的管道，但是字符串输出可能作为安全默认值进行了转义。我确定必须有一个允许 html 的选项，但在我搜索文档时找不到它。

我如何告诉管道允许实际的 html 呈现？

Answer 1

使用绑定(bind)到 innerHTML 或 outerHTML 渲染已经转义的 html。例如<span [innerHTML]="someString | toHtmlPipe"></span> .参见 this plunk :

@Pipe({
  name: 'wrapBold'
})
class WrapBold {
  transform(content) {
    return `<b>${content}</b>`;
  }
}

@Component({
  selector: 'my-app',
  pipes: [WrapBold],
  template: `
    <div>
      Hello <span [outerHTML]="content | wrapBold"></span>
    </div>
  `
})
export class App {
  constructor() {
    this.content = 'Angular2'
  }
}