小编Wal*_*aib的帖子

Angular FormArray:引用模板中动态添加的FormControl

我正在使用Angular Reactive表单,已向FormArray中动态添加了两个FormControl,但是在将它们与formControlName绑定时,却无法在模板中引用这些FormControl。在模板中,我将循环索引变量“ i”分配给formControlName,但它不起作用。通过将控件与formControlName绑定,可以得到“具有路径的窗体控件没有值访问器”。这是我的组件类代码:

export class Control {
  constructor(public controlType?: string, public label?: string, public required?: boolean, public placeholder?: string,
    public options?: string[], public value?: string) { }
}

export class FormComponent implements OnInit {
  reviewForm: FormGroup;

  constructor(public formService: FormService, public dialog: MdDialog) { }


  selectedControl: any = null;
  label: string;

  ngOnInit() {
    this.reviewForm = new FormGroup({
      'controlArray': new FormArray([
      ])
    });
  }

  addControl() {
    const myControl: Control = new Control(this.selectedControl.name, this.label, this.isRequired,
      this.selectedControl.attributes.value, this.selectedControl.attributes.options, 'null');
    var control: FormControl = new …
Run Code Online (Sandbox Code Playgroud)

form-control angular angular-reactive-forms angular-forms formarray

6
推荐指数
1
解决办法
5330
查看次数

FormControl值是否可以是数组?

我正在研究Angular反应形式。这是我的组件类代码:

ngOnInit(){
        this.reviewForm = this.fb.group({            
            'controlArray': new FormArray([])
        });        
        this.showDefaultForm();                     
    }

addForm() {
    (<FormArray>this.reviewForm.get('controlArray')).push(this.fb.group({
        controlType: control.controlType,
        options: control.options,

    }));
}
Run Code Online (Sandbox Code Playgroud)

我收到TypeError:this.validator不是与此相关的函数。我认为这是由于将字符串数组(即control.options)分配为FormControl的值。如果我将其设置为FormArray,则此错误将解决,但是我在将其作为FormArray处理为模板时遇到了问题。请告诉我是否不使用FormArray,可以将字符串数组作为值分配给FormControl吗?如果没有,那么如何在模板中将其作为FormArray处理。谢谢

form-control angular angular-reactive-forms formarray

2
推荐指数
1
解决办法
3610
查看次数

FormArray的长度不会由form.reset()重置

我正在使用Angular表单数据驱动方法,我向FormArray动态添加了表单控件,我使用form.reset()重置了添加的控件,但是form.reset()并不重置FormArray的长度,我发现这是一个已知的问题,可以使用https://github.com/angular/angular/pull/11051这种方法解决,但我对此尚不清楚。请帮忙,谢谢

reviewForm: FormGroup;
  ngOnInit(){
    this.reviewForm = new FormGroup({            
      'controlArray': new FormArray([        
    ])
    });
  }

onSubmit(){     
    this.formData = new FormData(this.formService.formName, this.reviewForm.value.controlArray);    
    let formControls = JSON.stringify(this.formData); 
    // console.log(formControls);
    this.formService.createForm(formControls)
      .subscribe(
        data => console.log(data),
        error => console.error(error)
    );
    this.reviewForm.reset();    
  }
Run Code Online (Sandbox Code Playgroud)

angular angular-reactive-forms

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