如果表单无效或单击后禁用按钮

Question

我想在表单无效时或在用户单击后禁用按钮，但不能同时禁用这两个按钮。

如何在引号内添加 2 个语句？

我这样试过，但没有用：

<form [formGroup]="weightForm" (submit)="saveWeight(); clicked=true; " novalidate>
    <ion-button expand="block" type="submit" [disabled]="!weightForm.valid && clicked==true" >Submit</ion-button>
</form>

这样只有点击后禁用才有效。

Answer 1

你可以在 Ts 文件中定义一个属性提交，如：

     submitted = false;
     onSubmit() {
     this.submitted = true;
     if (this.weightForm.invalid) { // stop here if form is invalid
      return;
    }
     this.updateInfo();
  }
      <form [formGroup]="weightForm" (ngSubmit)="submitted && onSubmit()" novalidate> 
     or disabled="{{submitted}}"

如果表单无效或单击后禁用按钮

Disable button if form is invalid OR after click

html

angular

ionic4