Search code examples
angularangular-reactive-formsform-controlformarray

Whether a FormControl value can be an array?


I am working on Angular Reactive form. This is my component class code:

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,

    }));
}

I am getting TypeError: this.validator is not a function with this. I think its due to assigning a string array (i.e. control.options) as value to FormControl. If I make it a FormArray then this error resolves, but I am having issue to handle it as FormArray in template. Please tell if I don't use FormArray, can I assign a string array as value to FormControl? If no then how to handle it as FormArray in template. Thanks


Solution

  • Finally I solved it, and the answer is yes. A FormControl's value can be an array. But for this you must have to enclose the value with in square brackets [ ]. Moreover, for simple values(Non arrays) these Square brackets are optional, meaning you may enclose the value within or without square brackets.

    Code explanation:

    (<FormArray>this.reviewForm.get('controlArray')).push(this.fb.group({
            controlType: control.controlType,
            options: [control.options], //previously I was not using square brackets with options value i.e. options: control.options which was wrong.
    
        }));