相关疑难解决方法(0)

ng14 中具有强类型表单的 FormBuilder

我有以下表格:

const enum Fields {
  FirstName = 'firstName',
  LastName = 'lastName'
}

interface FormType {
  [Fields.FirstName]: FormControl<string | null>;
  [Fields.LastName]: FormControl<string | null>;
}

public form!: FormGroup<FormType>;

this.form = new FormGroup({
  [Fields.FirstName]: new FormControl(null, { validators: Validators.required }),
  [Fields.LastName]: new FormControl(null, { validators: Validators.required }),
});
Run Code Online (Sandbox Code Playgroud)

使用 theenum是我为了避免输入错误而养成的习惯。

当我这样做时this.form.getRawValue().firstName, 的类型firstName被正确定义为string | null。但是,我更喜欢使用FormBuilder来构建我的表单,但我找不到使用 来翻译上面表单的方法FormBuilder。我试过这个:

this.form = this._fb.group<FormType>({
  [Fields.FirstName]: ['', Validators.required],
  [Fields.LastName]: ['', Validators.required],
});
Run Code Online (Sandbox Code Playgroud)

我当然可以使用一个FormGroup没有任何类型的简单的,但它会达不到目的:p

然而,这甚至不能作为 的推断类型 …

formbuilder angular angular-reactive-forms angular14

11
推荐指数
1
解决办法
1万
查看次数