如何在我的模板（Angular2/TypeScript）中将HTML字符串转换为HTML？

我有一个dummy-data.ts文件这个对象。通过一项服务，我成功将其拉到app.component.ts。如何在我的模板（Angular2/TypeScript）中将HTML字符串转换为HTML？

{name:"Object1", 
    prop1: {key:'value', key:'value'}, 
    password: "[email protected]", 
    htmlText:'<h4>This is THE demo text</h4><p>I want it to display as HTML</p>' 
}

目前app.component.ts看起来像这样，简单地开始了：

@Component({ 
    selector: 'my-app', 
    template: `<h1>{{title}}</h1> 
     <p *ngFor="#plot of plots"> 
      {{plot.personalPanelText.transition}} 
     </p> 
`, 
providers: [PlotService] 
})

最终的结果是一个字符串，而不是HTML。我希望HTML是代码，而不是带有HTML标签的文本。

我已经尝试了几种方法，并在世界各地广网和Angular2文档戳，但无法找到一个解决方案。

在此先感谢！

来源

2016-04-28 McPhelpsius

看，我不能看到您存储的对象，因此在我的答案代码可能并不完全适合您的需求。只需添加评论或更新您的问题与更多细节。 –

在JavaScript中，HTML只能以字符串形式出现。因此，我不明白你的意思*“最终的结果是字符串而不是HTML，我希望HTML是代码，而不是带有HTML标签的文本。”*。 –

您可以绑定到innerHtml，如：

<div [innerHtml]="someProp.htmlText"></div>

角不实例，其中匹配的标签或HTML属性的选择以这种方式添加任何成分，也不会解决任何绑定（如{{xx}}）

也How to bind raw html in Angular2

来源

2016-04-28 17:08:02

完美！谢谢 – McPhelpsius

如何在我的模板（Angular2/TypeScript）中将HTML字符串转换为HTML？

回答

相关问题