Question

我需要创建一个基于 Angular 12 的非常简单的静态应用程序（“静态”意味着它不使用 AJAX）并显示一些 FontAwesome 图标。我决定upload the repository earlier

我做了 ng add @fortawesome/angular-fontawesome 并选择了所有图标包。然后我想使用 Angular 路由和组件创建一个隐私政策页面。我以前这样做过，但我在这里没有成功。

我将 FontAwesomeModule 添加到应用模块

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FontAwesomeModule,
    RouterModule,
  ],
  exports: [
    FontAwesomeModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(fa: FaIconLibrary, faConfig: FaConfig) {
    fa.addIconPacks(fab, fas, far);
    faConfig.fixedWidth = true;
  }
}

然后 ComponentsModule 导入 PagesModule。我什至尝试同时导入和导出 FontAwesomeModule。

没什么。

如果您查看 template，我可以使用 <fa-icon [icon]="['fab','github']"></fa-icon> 语法。但在 privacy policy page，无论如何，我总是得到同样的错误

Error: src/app/pages/privacy-policy/privacy-policy.component.html:3:5 - error NG8001: 'fa-icon' is not a known element:
1. If 'fa-icon' is an Angular component, then verify that it is part of this module.
2. If 'fa-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

3     <fa-icon fixedWidth="true" [icon]="warning"></fa-icon>
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/pages/privacy-policy/privacy-policy.component.ts:6:16
    6   templateUrl: './privacy-policy.component.html',
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component PrivacyPolicyComponent.


Error: src/app/pages/privacy-policy/privacy-policy.component.html:3:32 - error NG8002: Can't bind to 'icon' since it isn't a known property of 'fa-icon'.
1. If 'fa-icon' is an Angular component and it has 'icon' input, then verify that it is part of this module.
2. If 'fa-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

3     <fa-icon fixedWidth="true" [icon]="warning"></fa-icon>
                                 ~~~~~~~~~~~~~~~~

  src/app/pages/privacy-policy/privacy-policy.component.ts:6:16
    6   templateUrl: './privacy-policy.component.html',
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component PrivacyPolicyComponent.

我根据 FA 说明在应用程序的主模块中导入了 FontAwesomeModule。但它只适用于主页面，而不适用于包含在子模块中的页面。

我该如何解决这个问题？

无法使 fa-icon 在 Angular 子模块中工作

0 个答案: