关于如何在 Angular 绑定中显示 Unicode 字符代码有一些答案,但我正在尝试动态显示一个答案,但一切似乎都失败了。
我有一个组件接收字符代码作为@Input
范围。
<my-component [icon]="e901"></my-component>
然后该组件尝试显示它,但这些都不起作用:
<i>{{ "\u" + icon }}</i>
<i [innerHTML]="'\u' + icon"</i>
<i [innerHTML]="`\u${icon}`"</i>
<i [innerHTML]="'&#' + icon + ';'"</i>
语法有很大的发挥空间,但它总是要么导致错误,要么只是简单的显示\ue901
作为字符串。如果我对代码进行硬编码,它确实有效:
<i>{{ "\ue901" }}</i>
我是在模板还是 TypeScript 中生成字符串并不重要。如果我尝试将整个代码作为参数传递,它就不起作用。伙计们,有什么想法吗?
JGFMK指出了一半答案后,解决方案如下:
在代码中:
this.icon = '&#x' + this.icon + ';';
然后在模板中:
<span [innerHTML]="icon"></span>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)