在模板中分配和检查变量

Question

我想弄清楚如何在 ngFor 循环中找到某个 value/string 时设置变量，并在找到时在同一模板中显示 div...

当下面代码中的这个语句为真时，我希望显示上面 div 的内容（只显示一次）： *ngIf="item.status == 'NODATA'

所以我试图找出如何设置一个简单的变量并将其设置为true，并以此为基础显示div，但我没有成功。

任何建议表示赞赏...我正在使用 Angular 12....

  <div *ngIf="someVariable?">
     I want this to be displayed when the *ngIf="item.status == 'NODATA' statement is true
   </div>

    <tr *ngFor="let item of getData.result.uga; let i = index">
      <td>
         <ng-container *ngIf="item.status == 'NODATA';else second">
            NO DATA 
         </ng-container>
         <ng-template #second>
           {{item.status}}
         </ng-template>
      </td>
    </tr>

Answer 1

当您获得 uga 数据时，您可以简单地检查它。例如，在打字稿中将数据加载到 uga 后，编写以下代码：

if(getData.result.uga.some(r=>r.status === 'NODATA'))
   this.someVariable = true;
else
   this.someVariable = false;

Answer 2

<ng-container *ngFor="let item of getData?.result?.uga; let i = index">
  <div *ngIf="item?.status == 'NODATA'">
    I want this to be displasdyed when the *ngIf="item.status == 'NODATA'
    statement is true
  </div>
  <tr>
    <td>
      <ng-container *ngIf="item.status == 'NODATA';else second">
        NO DATA
      </ng-container>
      <ng-template #second>
        {{item.status}}
      </ng-template>
    </td>
  </tr>
</ng-container>

你可以的。在父元素中使用 for 循环。我正在使用 <ng-container></ng-container

Answer 3

创建一个方法，当 item.status == 'NODATA' 时 return 为真，然后像这样调用该方法

div *ngIf="thatMethod()">
 I want this to be displayed when the *ngIf="item.status == 'NODATA' statement is true

<tr *ngFor="let item of getData.result.uga; let i = index">
  <td>
     <ng-container *ngIf="item.status == 'NODATA';else second">
        NO DATA 
     </ng-container>
     <ng-template #second>
       {{item.status}}
     </ng-template>
  </td>
</tr>

在模板中分配和检查变量

Assign and check variable in Template

angular