Nativescript 在 NavigationButton 上使用自定义图标答案

【问题标题】：Nativescript using custom icons on NavigationButtonNativescript 在 NavigationButton 上使用自定义图标
【发布时间】：2017-06-05 02:12:57
【问题描述】：

我正在尝试在 NativeScript Angular 应用程序的 ActionBar 上添加一个带有自定义字体的按钮。这是我迄今为止尝试过的：

<ActionBar class="cp-icon">
    <NavigationButton text="&#xE801;" (tap)="goBack()"></NavigationButton>
    <Image src="res://logo_h_white"></Image>
</ActionBar>

// Or one of these optio
<ActionItem text="&#xE801;" (tap)="goBack()"></ActionItem>
<Label text="&#xE801;"></Label>
<Button text="&#xE801;"></Button>

但它们似乎都没有工作。我确实安装了字体，因为我可以在视图中使用。另外，如果我只是将文本属性更改为字符串而不是图标，它也不会显示任何内容。

有没有办法做到这一点？

【问题讨论】：

标签： angular nativescript nativescript-angular

【解决方案1】：

最好的办法是使用 nativescript-ngx-fonticon 插件：https://github.com/NathanWalker/nativescript-ngx-fonticon

通过查看这个 SO 答案来避免一些常见的陷阱：https://stackoverflow.com/a/41861624/2596974

【讨论】：

谢谢！我会尝试混合这些。至少第一个链接可以更轻松地应用字体图标

【解决方案2】：

这样做的方法是将icon.decode="font://&#xE801;" 与您的图标字体类一起使用。见下文；

<NavigationButton text="Wont Show" icon.decode="font://&#xE801;" class="fas" (tap)="goBack()"/>

【讨论】：

@celsomtrindade