javascript - 当表单已经为 [disabled] 字段设置了 form.valid 字段时，在提交表单后禁用按钮

Question

我有一个响应式表单，它由一个按钮和另外两个字段组成。

我已经设置了一个验证器。如果验证器为真，我将通过“FormName.valid”启用按钮，同样如果为假，则按钮被禁用

我想要什么？

我也想在点击提交按钮后禁用按钮

我尝试了什么？

我尝试了 FormName.reset()，它确实禁用了按钮，但是当我的微调器运行时，它在后台显示两个空字段的错误。 (所以，我不想这样做)

HTML:

<form [formGroup]="FormName" (ngSubmit)=sendData()>
       // Two other fields here
        <div id="frame-send-button" text-center>
            <button [disabled]="!FormName.valid" type="submit">
                Submit
            </button>
</form>

typescript

表单初始化

this.FormName= new FormGroup({
        field1: new FormControl(this.field1value, Validators.required),
        field2: new FormControl(this.field2value)
    }, IsFutureValidator('somevalidator'));

有什么建议吗？

Answer 1

document.yourQuerySelector('submitForm').setAttribute('disabled');

这会将您选择的属性添加到任何元素。 “禁用”将在这种情况下起作用。