[英]How can I convert strings of HTML into HTML in my template (Angular2/TypeScript)?
I have this object in a dummy-data.ts
file. 我在
dummy-data.ts
文件中有这个对象。 Through a service I pull it successfully in to app.component.ts
. 通过服务我成功将其
app.component.ts
。
{name:"Object1",
prop1: {key:'value', key:'value'},
password: "P@ssword1",
htmlText:'<h4>This is THE demo text</h4><p>I want it to display as HTML</p>'
}
Currently app.component.ts
looks like this, to start out simply: 目前
app.component.ts
看起来像这样,简单地开始:
@Component({
selector: 'my-app',
template: `<h1>{{title}}</h1>
<p *ngFor="#plot of plots">
{{plot.personalPanelText.transition}}
</p>
`,
providers: [PlotService]
})
The end result is strings instead of HTML. 最终结果是字符串而不是HTML。 I want the HTML to be code, not text with HTML tags.
我希望HTML是代码,而不是带HTML标签的文本。
I've tried a couple ways and poked around the world wide nets and Angular2 docs, but couldn't find a solution. 我尝试了几种方法,并在全球网和Angular2文档中搜索,但找不到解决方案。
Thanks in advance! 提前致谢!
You can bind to innerHtml
like: 您可以绑定到
innerHtml
如:
<div [innerHtml]="someProp.htmlText"></div>
Angular does not instantiate any components where the selectors that match tags or attributes in HTML added this way nor will it resolve any bindings (like {{xx}}
) Angular不会实例化任何与HTML中的标记或属性匹配的选择器以这种方式添加的组件,也不会解析任何绑定(例如
{{xx}}
)
See also How to bind raw html in Angular2 另请参见如何在Angular2中绑定原始html
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.