Angular6 表单验证点击一个按钮后其它两个按钮变更为不可点击

Question

问题描述

现在有三个按钮，当我点击一个的时候，另外两个的disabled要变为不可用，按钮是下面这些

<button nz-button nzType="primary" [disabled]="!validateForm.valid " (click)="getBtnType(1)">保存&关闭</button>
<button nz-button nzType="primary" [disabled]="!validateForm.valid " (click)="getBtnType(2)">保存&继续</button>
<button nz-button (click)="resetForm($event)">重置</button>

写的有点晕了...

Answer 1

一个简单的办法，如果保存过程中发起 Http 请求，并且使用的是 _HttpClient 则：

<button nz-button nzType="primary" [disabled]="!validateForm.valid || http.loading" (click)="getBtnType(1)">保存&关闭</button>
<button nz-button nzType="primary" [disabled]="!validateForm.valid || http.loading" (click)="getBtnType(2)">保存&继续</button>
<button nz-button [disabled]="http.loading" (click)="resetForm($event)">重置</button>