首页 > 解决方案 > 通过 ng-template 进行表单验证

问题描述

我有一个包含模板出口的表单,用于模态。我希望能够在模板中包含输入等,并使用表单进行验证。我不能将表单放在模板中,因为完成按钮包含在模态的模板中,它需要知道表单是否有效。我的组件和modal之间的通信是通过属性或者通过letng-template中的s

我发现另一个涉及类似问题的问题,但答案说的是内容容器,这似乎并没有真正解决我的需要。

我的模态模板的相关部分

<form #modalForm="ngForm">
    <ng-container [ngTemplateOutlet]="template" [ngTemplateOutletContext]="{$implicit: modalData}"></ng-container>
    <button (click)="success()" [disabled]="modalForm.invalid">
</form>

此模式实例代码的相关部分

<ng-template let-data>
    <div [ngSwitch]="index">
        <div *ngSwitchCase="0">
            <input type="text" name="inp" [(ngModel)]="inpu" #inp="ngModel" required>
        </div>
    </div>
</ng-template>

谢谢大家!

标签: angularformsvalidation

解决方案


推荐阅读