Angular 项目，在保存新文件时禁用添加图标 Object/Data

Question

在我的 table 上面 includes/shows 一个特定对象的列表，我放了一个添加按钮，但实际上它不是一个按钮，它是这样的，混合了跨度，一个和图标

    <div id="table" class="table-editable">
      <span class="table-add float-right mb-3 mr-2">
        <a class="text-success" (click)="add()">
          <mdb-icon fas icon="plus" size="2x"></mdb-icon>
        </a>
      </span>
.
.
.
    </div>

因此，当点击添加图标时，新的空行会在 table 到 add/enter 新对象数据的末尾创建，在此期间，从创建新行到点击保存按钮，我想禁用添加按钮，但我无法禁用该图标。

请注意，我的登录表单中已经有了这个按钮，它可以正常工作，

 <button [disabled]="loading" class="btn btn-primary btn-block btn-signin">Sign In</button>

此登录按钮将在凭据检查期间禁用。但我不知道如何处理这个添加图标

谢谢！

Answer 1

您可以使用 *ngIf。我不确定它是否适用于 <mdb-icon> 标签甚至 <a> 锚标签所以可能是这样的：

      <span *ngIf="someCondition" class="table-add float-right mb-3 mr-2">
        <a class="text-success" (click)="add()">
          <mdb-icon fas icon="plus" size="2x"></mdb-icon>
        </a>
      </span>

      <span *ngIf="!someCondition" class="table-add float-right mb-3 mr-2">
        <!-- whatever HTML you want to render instead, or nothing -->
      </span>

Answer 2

该过程应该与登录相同button，很遗憾，为了给您一个正确的答案，我需要您的typescript代码。

同时确保您用于禁用按钮的加载属性在您的 add() 方法中设置为 true，并在您的保存方法中设置为 false。

Answer 3

感谢@Ben Hulan！最终代码是这样的，

<div *ngIf="addButton">
    <span class="table-add float-right mb-3 mr-2">
      <a class="text-success" (click)="add()">
        <mdb-icon fas icon="plus" size="2x"></mdb-icon>
      </a>
    </span>
  </div>
  <div *ngIf="!addButton">
    <span class="table-add float-right mb-3 mr-2">
      <a>
        <mdb-icon fas icon="plus" size="2x"></mdb-icon>
      </a>
    </span>
  </div>

Angular 项目，在保存新文件时禁用添加图标 Object/Data

Angular Project, Disable Add Icon, During Saving A New Object/Data

html

typescript

angular

disable