html - Angular 2:在插值的双花括号{{}}中应用样式或使用html标签

我为工具提示创建了一个组件。以下是我的视图显示方式：

<tooltip [tooltipDisplayText]="ttp.mainText" tooltipFullText="{{ttp.fieldType}} {{ttp.mainText}} {{ttp.subText}}"></tooltip>

我希望它显示如下：假设（fieldType：名称，mainText：Shahrukh和subText：Actor）

名称
沙鲁克
演员

但是我很困惑如何格式化方括号。有人可以帮我弄这个吗？

最佳答案

您可以在innerHTML属性中使用它的属性中传递任何字符串

tooltipFullText="<div><b>{{ttp.fieldType}}</b></div>{{ttp.mainText}}
                     <div><i>{{ttp.subText}}</i></div>"

然后在您的工具提示组件中：

@Input() tooltipFullText;

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

Demo

关于html - Angular 2:在插值的双花括号{{}}中应用样式或使用html标签，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/39803575/