我的代码
<i *ngIf="!isFollowing" class="far fa-bell"></i>
<i *ngIf="isFollowing" class="fas fa-bell"></i>
isFollowing 的类型是布尔型
每当我将其更改为 true 或 false 时，它都会根据表达式显示新元素，但它不会删除前一个元素，而是将新元素添加到 DOM。 结果，多个图标就像在图像中一样可见。
我相信更改检测正在检测更改并添加新的 DOM 元素，但它不会更新以前的 DOM 元素。
【问题讨论】：
<i [class]="'fa-bell fa' + (isFollowing ? 's' : 'r')"></i>
标签： angular angular6 angular-ng-if
试试这个
<i [ngClass]="{'far': !isFollowing, 'fas': isFollowing}" class="fa-bell"> <i>
【讨论】：
试试
<i *ngIf="!isFollowing; else follow" class="far fa-bell"></i>
<ng-template #follow><i class="fas fa-bell"></i></ng-template>
【讨论】：
*ngIf 之一表现不佳，不。 ng-template 依赖于第一个 *ngIf 的条件：代码从两个条件变为一个。
ngIf 指令，因此您的代码仍然没有解决问题，只是隐藏了它。你是什么意思ngIf 是“表现不佳”？这不会发生。
ngClass 的答案，因为我觉得它更合适）。
您为什么不使用ngClass 这样做？
<i [ngClass]="{'fas fa-bell': isFollowing == true, 'far fa-bell': isFollowing == false}"></i>
【讨论】：