首页 > 解决方案 > 按钮禁用无法正常工作

问题描述

这是我的场景,我有一个日期选择器和一个保存按钮。

当日期不可用时,我禁用了保存按钮。实际上我的代码在一般情况下工作

这是我当前的代码:

disableDate() {
for (let index = 0; index < this.dataSource.data.length; index++) {
  if (this.dataSource.data[index].detail[0].dob != '' && this.dataSource.data[index].detail[0].dob != null
    && this.dataSource.data[index].detail[0].doe != '' && this.dataSource.data[index].detail[0].doe != null
    && this.dataSource.data[index].detail[0].dom != '' && this.dataSource.data[index].detail[0].dom != null
  ) {
    if (this.formatDate(this.dataSource.data[index].detail[0].dob) > this.formatDate(this.dataSource.data[index].detail[0].doe)) {
      return true;
    }
  }
}
   return false;
}

这是我用于禁用按钮的 HTML 代码

<button mat-raised-button class="mx-1" color="primary" (click)="saveLplv()"
  [disabled]="disableDate()">Save</button>

我在这里做错了什么;为什么禁用按钮无法正常工作?

标签: angularangular8

解决方案


第一
返回类型disableDate应该是 bool。

第二

我建议您创建一个变量,例如disableBtn最初为其分配错误值

 disableBtn: boolean = false

然后在您检查条件的方法中,根据您的情况将按钮的状态更改为真/假


推荐阅读