Angular 在动态模块中使用 Fontawesome 指令

Question

我从服务器端得到一个包含 fontawesome 指令("fa-icon") 的字符串，我需要在前端显示相应的 fontawesome 图标。

我参考了一个创建动态模块的工作示例： 但是，如果我尝试使用 fontawesome 指令编译模板，它会抛出错误...请参阅我的示例代码：https://stackblitz.com/edit/dynamic-module-with-fontawesome

非常感谢您的帮助！

Answer 1

执行代码时出现异常，提示 fa-icon 未知。这意味着该模块尚未导入。这就是为什么在你的临时模块中你需要导入 Fontawesome:

const tmpModule = NgModule({
      imports: [CommonModule, FontAwesomeModule],...
});

Answer 2

我设法在 stackblitz 中解决了你的问题。 运行 示例：https://stackblitz.com/edit/dynamic-module-with-fontawesome-z6zq2h

您必须将图标作为 iconProp 添加到您的组件实例，否则它在 fa-icon 组件中是未定义的：

this.cmpRef.instance.myIcon = faSpinner;
this.cmpRef.instance.iconProp = faSpinner;