Question

我正在处理一个网页。其中一页将是一些数学测试。好的，我可以使用模板驱动的表单和验证来制作页面，但是我想学习有关制作此页面的知识，因此我采用了反应式表单。到目前为止，我的验证有效： -禁用按钮，直到我输入正确的数字 -将显示错误

我的一个很大的问题是禁用按钮无法正常工作。如果我在其中一个字段中输入正确，而在另一个字段中输入错误，则两个按钮都将被禁用，或者我可以用错误的输入来按下按钮，这样我的页面就会崩溃。

是否可以用一种反应形式将输入验证和按钮验证分开？当我包含更多测试时，这将使操作变得更容易。

我尝试使用.... value.valid为每个按钮在模板中进行验证，但这无法正常工作

我的代码已打开：

https://stackblitz.com/edit/angular-5cgyyg?file=src%2Fapp%2Fapp.module.ts

我对2按钮做了些微改动：

<button mat-raised-button color="primary" type="submit"
                [disabled]="primForm.pristine || primForm.invalid || primForm.value.zahl === '' || primForm.value.jahr !== ''"
                class="btn btn-success">
          Zerlegen
        </button>

第二个：

<button mat-raised-button color="primary" type="submit"
              [disabled]="primForm.pristine || primForm.invalid || primForm.value.jahr === '' || primForm.value.zahl !==''"
              class="btn btn-success">Prüfen
      </button>

现在，当两个输入字段都包含内容时，两个按钮均被禁用。

一件事，仍然在寻找一种更优雅的解决方法。

也许有人对此有想法。

预先感谢

Angular 7反应形式控件提交按钮

0 个答案: