Angular 指令不适用于 ng-container

【问题标题】：Angular directive not working with ng-containerAngular 指令不适用于 ng-container
【发布时间】：2021-11-27 03:33:51
【问题描述】：

下面给出的代码 ng-if 没有按预期工作

如果displayGroup 的值是D 那么它会打印第一个和第二个块，我有没有搞错

<div *ngIf="(bookTravelInfo.displayGroup | uppercase) === 'A' || 'B' || 'C'  ">
  <h2>Perfect!</h2>
</div>
<div *ngIf="(bookTravelInfo.displayGroup | uppercase) === 'D'  ">
  <h2>Does not Perfect</h2>
</div>

【问题讨论】：

标签： javascript angular angular-directive

【解决方案1】：

如果您想检查bookTravelInfo.displayGroup 是“A”还是“B”或“C”，

使用

*ngIf="['A', 'B', 'C'].includes(bookTravelInfo.displayGroup | uppercase)"

|| 来自 *ngIf 的逻辑 OR 运算符永远不会返回 false。

根据ToBoolean，当值既不是null，也不是undefined，也不是false时，布尔结果返回true。

因此第一个 <div> 元素仍显示为：

*ngIf="(bookTravelInfo.displayGroup | uppercase) === 'A' || 'B' || 'C'"

【讨论】：