如何使用 fort-awesome 将 ngClass 与 fa-icon 元素一起使用

Question

我正在使用 Fort Awesome 库在我的 Angular 7 项目中插入图标。设置是正确的，因为我能够在我的网页上看到图标。问题是我如何将这些图标与 ngClass 一起使用，以便根据变量的值动态更改它们？这是我的 html 代码：

<div>
  <a (click)="toggle(filters[0])" data-toggle="collapse" href="#coverageFilters" role="button" aria-expanded="true" aria-controls="coverageFilters"><fa-icon icon="minus"></fa-icon> {{filters[0].name}}</a>
  <div class="collapse show multi-collapse" id="coverageFilters">
    <ul class="filter" *ngFor="let item of filters[0].value"><input type="checkbox"> {{item}}</ul>
  </div>
</div>

锚标记中的切换函数在 true 和 false 之间更改 filters[0]['collapse'] 的值，我想使用这个变量的值 (filters[0]['collapse']) 将 fa-icon 元素中的图标从 "minus" 动态更改为 "plus".

本来可以使用 Font Awesome 来实现这一点，除非 ngClass 不能与 Font Awesome 元素一起使用来实现我想要实现的目标。

Answer 1

我不会直接回答你的问题，但它可能是另一种选择，

<fa-icon icon="{{filters[0]['collapse'] ? 'plus' : 'minus' }}"></fa-icon>

如何使用 fort-awesome 将 ngClass 与 fa-icon 元素一起使用

How to use ngClass with fa-icon element using fort-awesome

font-awesome

angular

angular-fontawesome