时间戳

首页 > 解决方案 > Angular 指令不适用于 ng-container

javascript - Angular 指令不适用于 ng-container

问题描述

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

标签： javascriptangularangular-directive

解决方案

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

采用

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

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

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

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

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

推荐阅读