Nested FormArray in Angular 4?

Question

Hey need help with reactive forms in Angular 4. I've got the next FormGroup declared:

userForm:FormGroup = new FormGroup ({
    employeenumber: new FormControl(),
    name: new FormControl(),
    lastname: new FormControl(),
    birthdate: new FormControl(),
    phone: new FormControl(),
    email: new FormControl(),
    username: new FormControl(),
    password: new FormControl(),
    blocked: new FormControl(),
    departments: new FormArray([
        new FormControl()
    ])
});

But I want to nest other array inside the departments array. To have something like this:

departments: [
    { department: 'test', roles:['rol1', 'rol2'] }
]

It is possible to nest FormArrays? or what is the best way of doing this.

yes, its possible, you can see the angular reactive form document — Aniruddha Das, Oct 09 '17 at 17:25

score 5 · Answer 1 · answered Oct 09 '17 at 18:14

5

I think you are looking for something like this Nested Reactive Forms.

There a Highly Nested one too if you wish .

I couldn't place the whole code here as it is too long and your question wanted to check if it is possible to nest Form Array.Hope this helps

answered Oct 09 '17 at 18:14

Rahul Singh

19,030
11
64
86

4

Useful links, but lacking examples of nesting components with nested FormArrays. – Jack Feb 06 '18 at 14:06
Ya jack only stand alone stuff – Rahul Singh Feb 06 '18 at 14:08

Nested FormArray in Angular 4?

1 Answers1