在Ionic2应用程序中，我想呈现包含在HTML字符串中的<ion-icon> s。HTML字符串可以是这样的:
public explanation = "To open the menu, click the <ion-icon name='menu'></ion-icon> icon to the top left.";
字符串存储在翻译文件中。当输出时，我知道HTML字符串默认情况下是转义的，并且我尝试用来输出字符串以防止清理:
<p [innerHTML]="explanation"></p>
问题:现在<ion-icon>代码没有转义，但图标也不呈现(即使节点存在于DOM中)。当使用像<b>标签这样的常规HTML时，代码工作得很好。
动态模板求值?
我怀疑这种行为是由于代码直接插入到DOM中，而不是由Ionic/Angular评估。对于Angular1，这里有很多关于SO的讨论。到目前为止，我看到的Angular2的解决方案都使用了已弃用的DynamicComponentLoader，或者相当复杂。
是否有任何简单的解决方案来显示图标?定义两个翻译字符串...LEFT_OF_ICON和...RIGHT_OF_ICON在这种情况下可以工作，但是感觉有点尴尬。
Angular将使用[innerHTML]="..."添加的HTML视为普通HTML，只是将其添加到DOM中，而不进行任何处理(没有绑定，没有指令或组件实例化)。
你可以用ViewContainerRef.createComponent()代替。
请参见Angular 2中带有用户点击选择组件的动态选项卡。