时间戳

首页 > 解决方案 > Angular6中的嵌套表单组

angular - Angular6中的嵌套表单组

问题描述

我正在尝试在 Angular6 中创建嵌套表单组。

serviceItemForm: FormGroup;
apiForm : FormGroup;

this.serviceItemForm = this.fb.group({
  'name': new FormControl('', Validators.required),
  'description': new FormControl('', Validators.required),
  'categoryIds': new FormControl([], Validators.required),
  'tags': [],
  'status': '',
  'orderFormType': new FormControl([], Validators.required),
  'orderFormKey': new FormControl([], Validators.required),
  'workflow': [],
  'orderFormAction': new FormControl('', Validators.required),
  'customUI': new FormControl(''),
  'api': this.fb.group({
    'apiurl': new FormControl(''),
    'apimethod': new FormControl(''),
    'headers': this.fb.array([]),
    'payload': '',
  }),
  'userGroup': []
});

this.apiForm = this.serviceItemForm.get('api');

这里 this.apiForm 给出了像Type 'AbstractControl' is not assignable to type 'FormGroup'. Property 'controls' is missing in type 'AbstractControl'.在 VSCode 中一样的错误。

请帮助我如何在 angular-6 中使用嵌套的表单组

标签： angular

解决方案

你可以试试下面的代码：

serviceItemForm: FormGroup;
apiForm : FormGroup;

this.apiForm = this.fb.group({
    'apiurl': new FormControl(''),
    'apimethod': new FormControl(''),
    'headers': this.fb.array([]),
    'payload': '',
  });

this.serviceItemForm = this.fb.group({
  'name': new FormControl('', Validators.required),
  'description': new FormControl('', Validators.required),
  'categoryIds': new FormControl([], Validators.required),
  'tags': [],
  'status': '',
  'orderFormType': new FormControl([], Validators.required),
  'orderFormKey': new FormControl([], Validators.required),
  'workflow': [],
  'orderFormAction': new FormControl('', Validators.required),
  'customUI': new FormControl(''),
  'api': this.apiForm,
  'userGroup': []
});

推荐阅读