具有模板驱动表单的自定义组件中的必填字段不会将该表单标记为无效

时间:2019-01-29 10:57:13

标签: angular angular-material

我正在template driven form中使用angular 7

我创建了一个自定义组件。

自定义组件具有required指令。

当该值为空/ null时,mat-error会正确显示,但是包含它的父表单不会被标记为无效。

我添加了一个简单的示例来显示此行为 custom component with required

有什么主意吗?

1 个答案:

答案 0 :(得分:0)

经过调查,我了解到自定义组件中的requierd处理可以解决显示验证错误,

为了将表单错误标记为无效,还需要在自定义组件中添加requierd指令。

<app-radio-button-list name="examinationTypeCtrl" 
                        [(ngModel)]="id"
                        #rd="ngModel"
                        required>
</app-radio-button-list>

fixed example

我发现了this link, 关于使用ControlValueAccessor实现的自定义组件的完美解释。