具有功能 RouterLink 的 Angular2 动态 HTML

Question

老用户，第一次提问!在两天的大部分时间里，我一直在努力解决这个问题，但无济于事，所以我们开始吧。

Angular2 中来自外部源的动态编译模板？

我正在使用 http 从 WordPress API 获取 HTML 形式的页面内容。所以我有一个这样的模板:

    <div [innerHTML]="contentHTML"> </div>

“contentHTML”是组件中的一个字符串变量，并通过 API 调用异步分配一个值，如下所示:

    <a routerLink="/help/faq.html"> </a>

我希望 routerLink 能够正常工作。当然，routerLink 可以是模板中有效的任何内容。

如果以上不可能

如果以上方法行不通，有什么方法可以解释传入的 HTML 并动态添加 routerLinks 以替换标准 hrefs？

Answer 1

我遇到了同样的问题，我关注了this answer ，但在导入 DynamicComponentModule 的代码中添加了一个简单的修改，但添加了 imports: [RouterModule]

所以步骤如下安装 ng-dynamic :

npm install --save ng-dynamic

然后使用以下导入和代码:

import { DynamicComponentModule } from 'ng-dynamic';

@NgModule({
   imports: [
       ...
       DynamicComponentModule.forRoot({imports: [RouterModule]}),
       ...
   ],
   ...
})
export class AppModule {} 

然后代替:

<div [innerHTML]="contentHTML"> </div>

使用:

<div *dynamicComponent="contentHTML"></div>

希望这对您有所帮助!