Car*_*ima 8 font-awesome angular
我在尝试使用 fontawesome 图标时遇到问题。我已经使用命令行将 FontAwesome 安装到我的项目中:
ng add @fortawesome/angular-fontawesome@latest
Run Code Online (Sandbox Code Playgroud)
我有一个子模块,我想在其中使用“fas”->“images”图标。所以,我创建了我的子模块:
import { PhotoListComponent } from './photo-list.component';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { fas } from '@fortawesome/free-solid-svg-icons';
@NgModule({
declarations: [
PhotoListComponent
],
imports: [
CommonModule,
FontAwesomeModule
]
})
export class PhotoListModule {
constructor() {
library.add(fas);
}
}
Run Code Online (Sandbox Code Playgroud)
我在这个子模块中有一个组件(photo-list.component.ts 和 photo-list.component.html)。在它的 HTML 文件中,我只是把这一行放在我的标题中显示图标:
<h1><fa-icon [icon]="['fas','images']"></fa-icon> Images</h1>
Run Code Online (Sandbox Code Playgroud)
当我运行我的 angular 项目并打开这个模块时,出现以下错误(并且图标不会显示):错误 NG8001: 'fa-icon' is not a known element
为什么不起作用?
我检查了代码: fontawesome 有一些变化,现在正确的导入必须是下一个:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';
import { FontAwesomeModule, FaIconLibrary } from '@fortawesome/angular-fontawesome';
import { faCoffee, fas } from '@fortawesome/free-solid-svg-icons';
@NgModule({
imports: [ BrowserModule, FormsModule, FontAwesomeModule ],
declarations: [ AppComponent, HelloComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule {
constructor(library: FaIconLibrary) {
library.addIconPacks(fas);
library.addIcons(faCoffee);
}
}
Run Code Online (Sandbox Code Playgroud)
根据您的代码查看工作示例:https : //stackblitz.com/edit/angular-5qu1fy
| 归档时间: |
|
| 查看次数: |
6505 次 |
| 最近记录: |