时间戳

首页 > 解决方案 > 如何使用禁用属性？Angular 10 禁用属性不起作用

angular - 如何使用禁用属性？Angular 10 禁用属性不起作用

问题描述

- -更新 - -

我早些时候发布了这个问题，但没有得到解决方案。在一个 github 博客中，我发现单独的“isButtonDisabled”不起作用，需要调用一个函数。在我的代码中，我只能在验证 ts 中的某些条件后带一个布尔值。怎么了？

github链接

我已经尝试过 [禁用] 或禁用。根据我在打字稿中的情况，它不能正常工作。我有 4 个按钮，我需要根据我的打字稿条件来实现它。我有 7 个需要评估的条件。到目前为止，无论条件如何，该按钮都会被禁用。请建议任何其他方法来实现它

HTML

<button type="button" [disabled]="isButtonDisabled"
              style="background: #79CEA4 !important;color: #FFFFFF !important;font-size: 13px;font-weight: 600;margin-right: 20px"
              class="btn  btn-lg" (click)="finish()">FINISH</button>

TS

isButtonDisabled:boolean;
for (var EmployeeList of Employee){
        if ((EmployeeList.EmployeeStatus== 'Active')  {
          this.isButtonDisabled= false;
          return 'circle3';  
        }
        else if((EmployeeList.EmployeeStatus== 'Inactive') {
           this.isButtonDisabled= true;
           return 'circle1';

}

标签： angulartypescript

解决方案

那里的问题是正常的 html<button>解释disabled="anything"为disabled。

因此，在 Angular 中，您可以使用以下方法实现拥有属性与不拥有属性：

<button [attr.disabled]="isButtonDisabled ? true: null"...

推荐阅读