javascript - 基于具有验证的模型的 Angular react 形式

Question

有没有一种方法可以基于现有的数据模型创建一个具有所有验证魔法的响应式(Reactive)表单。在下面的示例中，作者将整个新对象传递给 formbuilder，但我想要实现的是一种优雅的方式来告诉 formbuilder 哪些字段是必需的或需要一些其他验证。

https://malcoded.com/posts/angular-fundamentals-reactive-forms

export class PersonalData {
  email: string = '';
  mobile: string = '';
  country: string = '';
}
...
createFormGroupWithBuilderAndModel(formBuilder: FormBuilder) {
    return formBuilder.group({
      personalData: formBuilder.group(new PersonalData()),
      requestType: '',
      text: ''
    });
  }

我只想跳过为模型中的每个字段分配 FormControl 的过程。

@编辑

经过一些研究和@xrobert35 的一些提示后，我想尝试使用 https://www.npmjs.com/package/@rxweb/reactive-form-validators

Answer 1

它们可能有“多种”方式来做您想做的事，但只需扩展您的实际解决方案:您的个人数据将如下所示:

export class PersonalData {
  email: string = ['', Validators.required];
  mobile: string = ['', Validators.required, Validators.maxLength(10)];
  country: string = '';
}