问题标签 [angular-fontawesome]

我们为我们的 Angular 项目创建了一个私有的 npm UI 包，其中包含我们的 UI 组件。现在我尝试将所有需要的图标从 FontAwesome 添加到库中。我们使用 ng-packagr 生成 npm 包，这可以正常工作。如果我是我们的包，那么我会遇到构建问题：

'WebUiModule' 模板编译期间出错 无法解析相对于 [object Object] 的 @fortawesome/angular-fontawesome。

我们的想法是，我们在 UI npm 包中定义所有需要的图标，并且只使用我们在那里定义的图标。

我试图从升级font awesome 4到5. 我按照这个链接 删除了font awesome 4包：npm uninstall font-awesome 然后npmrc在我的项目的根目录中添加了一个包含此代码的文件，如他们在此处的文档中所述：

然后安装插件：npm install --save-dev @fortawesome/fontawesome-pro

在 angular.json文件中我添加了这段代码：

我以为所有的东西都设置好了。但是当我尝试通过输入<i class="far fa-acorn"></i>我的 html 来呈现一些图标时 .. 未显示的图标。

有人可以告诉我我的配置中缺少什么吗？

非常感谢。

我已经将@fortawesome/angular-fontawesome - 从这里 - https://www.npmjs.com/package/@fortawesome/angular-fontawesome安装到我的 Angular 7 应用程序中。

我可以使用图标，但我找不到通过 CSS 添加它们的方法。

我正在尝试添加这样的 ico CSS 伪元素：

这是行不通的。我所看到的只是一个空旷的广场。有人知道如何通过 CSS 伪元素使用图标吗？

我正在尝试将某个 Font Awesome 图标添加到我的 Angular 应用程序中，但它不起作用。

我按照以下步骤操作：

1. 跑npm install --save font-awesome angular-font-awesome
2. 更新 app.module：

import { AngularFontAwesomeModule } from 'angular-font-awesome';

imports: [AngularFontAwesomeModule]

3. 更新angular.json：

"styles": ["node_modules/font-awesome/css/font-awesome.css"]

此图标按预期显示：

但是当我尝试添加下面的图标时，什么都没有出现：

这就是我得到这个图标的地方。

有人可以告诉我为什么这个图标没有出现，以及我该如何解决这个问题？

我创建了一个新项目，安装了 font-awesome：

进口FontAwesomeModule：

并创建了一个简单的图标：

图标已成功显示。现在我想为path生成的图标设置样式：

但它不起作用。我的 Chrome 甚至没有在开发者工具中打印这条规则。

我该如何设计path？我必须准确地设置样式path，而不是fa-icon（应用渐变fill: url(#gradient)）。

我通过 iconName 调查了 fontawesome 图标的动态加载问题。但是代码不起作用。是什么原因？最佳做法是什么？为什么我需要在指令 ngOnInit() 挂钩中调用 ngOnChanges()？我在浏览器中遇到的错误是“FontAwesome：找不到图标。看起来您为此组件提供了一个空或未定义的图标对象。”

当我使用别名引用图标时，我无法导入它们。我特别注意到了 from 的问题@fortawesome/free-regular-svg-icons。有时您需要使用别名，因为库中的图标可能存在重复名称，并且您希望将它们都导入。

这是在 Angular 小升级（7.1 -> 7.2）之前工作的代码。这是来自fontawesome 文档的指导。请参阅页面上的最后一部分。

我已经尝试升级 fortawesome 软件包并使用正在导入的别名和图标来解决问题。我注意到删除别名可以让我很好地导入图标。

应用模块

相关包

浏览器错误 Uncaught ReferenceError: farCopy is not defined

在 Google 地图信息窗口 (API) 中显示 Font Awesome 5 图标

当在 html 模板中使用时，FA5 在我的 Angular 应用程序中按预期工作。但是当google.maps.InfoWindow我们在 Angular 之外使用时，我无法使用例如

<fa-icon [icon]="['fas', 'location-arrow']"></fa-icon> 在内容 html 字符串中。

我们还希望在运行时之前打包所有内容，因此 FA 不需要运行时调用 js 或 css。

谷歌地图信息窗口有一个这样的按钮：

我还添加"./node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss",到 angular.json 以防万一它有任何用处。

在升级到 FA5 之前，我使用<i class='fas fa-location-arrow'></i>了 ，效果很好，但后来我还在 index.html 中使用了 kit.fontawesome.com/***。

我认为我必须在我的 map-component.ts 文件中手动呈现图标，并将其传递给我的drawInfoWindow函数？但我不知道从哪里开始。有什么建议吗？

干杯!

只是想将 angular-fontawesome 与 Storybook.js 一起用作库（FaIconLibrary）。在以下文档中https://github.com/FortAwesome/angular-fontawesome/blob/master/docs/usage/icon-library.md#using-the-icon-library我要向构造函数添加一个属性。仅在 Storybook.js 文件 (index.stories.ts) 中，我看不到任何向构造函数添加任何内容的方法，因为它不存在。有人解决这个问题或有一个好的解决方法吗？谢谢

尝试@fortawesome/angular-fontawesome在我的 Angular 7 应用程序中使用时出现以下错误：

我遵循文档并以这种方式初始化模块：

这是我使用的确切版本：

非常感谢您的帮助！蒂埃里