Whether a FormControl value can be an array?

Waleed Shahzaib picture Waleed Shahzaib · Dec 12, 2017 · Viewed 7.9k times · Source

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

Answer

Waleed Shahzaib picture Waleed Shahzaib · Dec 12, 2017

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.

    }));