首页 > 解决方案 > 角度 *ngIf 条件

问题描述

我正在使用这两个条件,问题是按钮都出现了,而实际上只应该出现一个。

即如果="currentState == 'pause'"一个按钮出现,否则如果="currentState == 'pause' && 'taskdate'> 'data.key.deadline'"另一个按钮出现......问题是两者都出现而不仅仅是1。我认为这是因为currentState在两者中都是真的......我该如何解决这个问题?

html

 <div *dxTemplate="let data of 'cellTemplate'">
    <button type="button" data-toggle="dropdown" class="btn ClassPlay">
                <img style="width: 35px;" *ngIf="currentState=='pause' && taskdate <= data.key.deadline" src="./assets/play.svg">
                <img style="width: 35px;" *ngIf=" currentState=='pause' && taskdate > data.key.deadline" src="./assets/PlayRed.svg">
                <div *ngIf="currentState=='start'" src="./assets/playV.svg">
                  <img style="width: 38px;" *ngIf="currentRowIndex === data.rowIndex" src="./assets/playV.svg">
                  <img style="width: 38px;" *ngIf="currentRowIndex != data.rowIndex" src="./assets/PlayGrey.svg">
                </div>
     </button>
</div>

零件

taskdate = new Date();

图片

标签: angulartypescript

解决方案


不需要额外的单引号。当您使用'taskdate'时,它被评估为字符串。我相信,taskdate并且data?.key?.line是变量:

<img style="width: 35px;"     
    *ngIf="currentState == 'pause' && (taskDate <= data?.key?.line)" 
    src="./assets/pl.svg">
<img style="width: 35px;" 
    *ngIf="currentState == 'pause' && (taskdate > data?.key?.line)" 
    src="./assets/ap.svg">

推荐阅读