Angular2模板绑定Unicode

Question

我正在尝试在Angular2模板中显示一些符号。 这个可以正常工作：

<div>&#xe911;</div>

这也是有效的方法：

<div>{{"&#xe911"}}</div> //colon elided

但这个不行：

<div>{{getSymbol()}}</div>

whith

private symbol(): string {
    //return this.access.accessLevel >= AccessLevel.expert ? "\e911" : "\e917";
    return this.access.accessLevel >= AccessLevel.expert ? "" : "";
}

- M.N. Bug

Answer 1

使用字符串插值时，{{}} 被视为文本字符串。应该使用 innerHtml 绑定来获取元素中的实际 html 内容：

<div [innerHtml]="getSymbol()"></div>

- Poul Kruijt

---

谢谢，非常简单的解决方案。 - M.N. Bug

对我来说可行。直截了当的解决方案。 - Temi 'Topsy' Bello

为了防止Angular的变更检测立即调用getSymbol函数，我只是将文本分配给prop并指定prop而不是调用函数。 - Oleksandr Poshtaruk