angular - angular fontawesome 社交图标问题

Question

我在我的 Angular 应用程序中完成了npm installfor font-awesome 图标，我的package.json包含：

"@fortawesome/angular-fontawesome": "^0.5.0",
"@fortawesome/fontawesome-svg-core": "^1.2.36",
"@fortawesome/free-solid-svg-icons": "^5.15.4"

在我的 中app.module.ts，我导入了 font-awesome：

import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
imports: [
    BrowserModule,
    FontAwesomeModule,
    HttpClientModule
  ]

在我的组件中，

import { faCoffee } from '@fortawesome/free-solid-svg-icons';

现在，当我 <fa-icon [icon]="faCoffee"></fa-icon>在我的组件 html 中使用 , 时，我可以成功显示咖啡杯图标。现在我需要显示 facebook,instagram和之类的社交图标twitter，但是当我尝试<fa-icon [icon]="faFaceBook"></fa-icon>, 等时，没有图标出现。任何人都可以为我提供正确的文本以在 [icon]= 中使用这些社交图标吗？为了<fa-icon [icon]="?"></fa-icon>

Answer 1

以下是解决方案：

npm add  @fortawesome/free-brands-svg-icons

在组件中：

import { faTwitter,  faFacebookF, faInstagramSquare } from '@fortawesome/free-brands-svg-icons';

  faFacebook = faFacebookF;
  faInstagram = faInstagramSquare;
  faTwitter = faTwitter;


                 <li>
                    <fa-icon [icon]="faFacebook"></fa-icon>
                </li>
                <li>
                    <fa-icon [icon]="faInstagram"></fa-icon>
                </li>
                <li>
                    <fa-icon [icon]="faTwitter"></fa-icon>
                </li>