angular - Nativescript 在 NavigationButton 上使用自定义图标

Question

我正在尝试在 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>

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

有没有办法做到这一点？

Answer 1

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

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

Answer 2

做到这一点的方法是使用icon.decode="font://"你的图标字体类。见下文;

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