Question

我正在开发一个应用程序，我从服务器获取html格式的响应。我正在使用DomSanitizer的bypassSecurityTrustHtml并将已清理的html添加到我的组件（）。

我的问题是响应中的一些元素包含标记，表明链接可以从元素构建，例如：

<div thisIsActuallyaLink linkParam1="foo" linkParam2="bar">clickHere</div>

我想创建一个应用于innerhtml的指令，但是当显示html时，它不是用我的指令编译的......

如果有人想知道为什么转换html没有在服务器端完成：响应在几个应用程序中使用，并且链接必须具有不同的相对URL，具体取决于应用程序： - （

Answer 1

根本不可能使用[innerHTML]="..." 您可以在运行时编译组件以获取动态HTML的组件和指令。

有关详细信息，请参阅How can I use/create dynamic template to compile dynamic Component with Angular 2.0?。

Answer 2

也许尝试使用Pipe，就像这样：

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';

@Pipe({ name: 'safeHTML' })
export class SafeHtml implements PipeTransform {

    constructor(private sanitizer: DomSanitizer) { }

    transform(html: string) {
        return this.sanitizer.bypassSecurityTrustHtml(html)
    }
}

而不是 [innerHtml]="htmlExample | safeHTML"

Angular 2：如何将指令应用于已清理的html / innerhtml

2 个答案: