我试图根据返回的变量号显示/隐藏div,状态变量总是返回1或2。但我在我的html:中出现错误
此条件将始终返回"false",因为类型"1"one_answers"2"没有重叠。
我做错了什么?
.ts
status: number;
this.service.GetEstimationId(params['id']).subscribe(response => {
this.status = response.estimationStatus;
console.log(typeof this.status); // returns number
});
.html
<div class="d-flex justify-content-end" *ngIf="status === 1">
<button (click)="toggleEdit(null, true)" type="submit" class="btn-green mt-3 send">
<i class="far fa-file-alt mr-2"></i> Send
</button>
<div class="d-flex justify-content-end" *ngIf="status === 2">
<button (click)="toggleEdit(null, false)" type="submit" class="btn-green mt-3 send">
<i class="far fa-file-alt mr-2"></i> Save
</button>
</div>
您使用===
来检查用于比较两个变量以及检查数据类型的条件。
您可以将类型更改为数字:
this.status = Number(response.estimationStatus)
或请改用==
。
*ngIf="status == 1"
似乎还忘记关闭第一个div
标签:
<div class="d-flex justify-content-end" *ngIf="status === 1">
<button type="submit" class="btn-green mt-3 send">
<i class="far fa-file-alt mr-2"></i> Send
</button>
</div>
<div class="d-flex justify-content-end" *ngIf="status === 2">
<button type="submit" class="btn-green mt-3 send">
<i class="far fa-file-alt mr-2"></i> Save
</button>
</div>
唯一的问题是您的两个div是嵌套的,并且状态不能同时为1和2。把第二个div放在第一个div之外,它就会被解决。
<div class="d-flex justify-content-end" *ngIf="status===1">
<button type="submit" class="btn-green mt-3 send">
<i class="far fa-file-alt mr-2"></i> Send
</button>
</div>
<div class="d-flex justify-content-end" *ngIf="status===2">
<button type="submit" class="btn-green mt-3 send">
<i class="far fa-file-alt mr-2"></i> Save
</button>
</div>
我的老答案:
状态似乎是一个字符串。我的意思是,你认为它是1或2,但实际上它是";1〃;或";2〃;。所以有两种方法可以解决这个问题
最好的方法是将它们转化为数字。使用
Number(status) === 1
您可以忘记类型检查,让类型强制发生。这不是最佳做法。
status == 1