Angular4 禁用按钮，如果 json-schema-form 无效

Question

我有一个使用超过 1 个 json-schema-form 构建的注册表单。

我有

参与者必须填写的基本细节，我有 2 个动态的部分表格。仅当管理员为表单设置了参数时，才会显示这两个表单。

     <div class="registration-form">
       <json-schema-form [model]="participantEventInfo" [schema]="json_custom_form" (isValid)="isEventFormValid($event)" (onChanges)="updateParticipantEventInfo($event)"></json-schema-form>
       <json-schema-form [model]="participantTixInfo" [schema]="json_tix_custom_form" (onChanges)="updateParticipantTixInfo($event)" (isValid)="isTixFormValid($event)"></json-schema-form>
       <button type="submit" [disabled]="!participantEventInfo.isValid && !participantTixInfo.isValid" (click)="updateEventandTixInfoRegistration()">Update</button>
     </div>

所以现在我有 2 个 json 架构表单，一个用于事件信息，一个用于票务信息。我想禁用提交按钮，所以在我的提交按钮中，我想禁用 buttton 是未填写的架构表单之一。但是，根据我的代码，即使我填写了所有表单字段，该按钮也始终被禁用。我是否正确执行了禁用部分？

谢谢。

Answer 1

尝试检查这两个并禁用按钮

<button type="submit" [disabled]="!checkForm()" click)="updateEventandTixInfoRegistration()">Update</button>
checkForm(){
    if(document.forms[0].checkValidity() && document.forms[1].checkValidity()){
        return true;
    }
    else{
        return false;
    }
}