Angular指令不适用于ng-container

Question

下面给出的代码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>

Answer 1

如果要检查bookTravelInfo.displayGroup是“A”、“B”还是“C”，

使用

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

*ngIf中的||逻辑或运算符永远不会返回false。

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

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

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