如何使用angular2 Reactive表单构建嵌套数组？

I have an array like 
[  
   {  
      "PermissionRoleModule":{  
         "id":1,
         "legend":"businessModule",
         "group":[  
            {  
               "PermissionRoleGroup":{  
                  "id":1,
                  "permission":{  
                     "controleType":"ff",
                     "id":2,
                     "key":"create Business"
                  },
                  "roles":[  
                     {  
                        "id":1,
                        "name":"self"
                     },
                     {  
                        "id":2,
                        "name":"other"
                     }
                  ]
               }
            },
            {  
               "PermissionRoleGroup":{  
                  "id":1,
                  "permission":{  
                     "controleType":"ff",
                     "id":2,
                     "key":"edit business"
                  },
                  "roles":[  
                     {  
                        "id":1,
                        "name":"self"
                     },
                     {  
                        "id":2,
                        "name":"other"
                     }
                  ]
               }
            }
         ]
      }
   },
   {  
      "PermissionRoleModule":{  
         "id":2,
         "legend":"PanicModule",
         "group":[  
            {  
               "PermissionRoleGroup":{  
                  "id":1,
                  "permission":{  
                     "controleType":"ff",
                     "id":2,
                     "key":"create panic"
                  },
                  "roles":[  
                     {  
                        "id":1,
                        "name":"self"
                     },
                     {  
                        "id":2,
                        "name":"other"
                     }
                  ]
               }
            },
            {  
               "PermissionRoleGroup":{  
                  "id":1,
                  "permission":{  
                     "controleType":"ff",
                     "id":2,
                     "key":"edit panic"
                  },
                  "roles":[  
                     {  
                        "id":1,
                        "name":"self"
                     },
                     {  
                        "id":2,
                        "name":"other"
                     }
                  ]
               }
            }
         ]
      }
   }
]

我的观点就像附件中所示

当我点击提交按钮时，我期待 json 像

[  
   {  
      "name":"aaa",
      "description":"das",
      "permission":[  
         {  
            "permission_id":1,
            "relation":2
         }
      ]
   }
]

如何使用反应式表单为这种情况构建表单组

我试过这样

组件.ts

roleForm: FormGroup;
  formField: any;
validateForm() {
this.formField['rolename'] = new FormControl('', Validators.compose([Validators.required]))
this.formField['roledescription'] = new FormControl('', Validators.compose([Validators.required]))

this.form_objects.forEach(element => {
  if (element.group) {
    element.group.forEach(PermissionRoleGroup => {
      this.formField[PermissionRoleGroup.permission.key] = new FormControl({value:''}, Validators.compose([Validators.required]))

      if (PermissionRoleGroup.roles) {
        PermissionRoleGroup.roles.forEach(role => {
          this.formField[role.key] = new FormControl('', Validators.compose([Validators.required]))
        });
      }

    })
  }
});

this.roleForm = this.fb.group(this.formField);
 }

html

   <div  class="form-row" *ngFor="let element of form_objects; let i = index; ">

              <table  class="table table-bordered">
                <tr *ngFor="let permissionRoleGroup of element.group;let j= index;">
                  <table class="table table-bordered" style="margin-bottom: 0px;">
                    <td width="40%">
                      <label class="font-light">
                        <input type="checkbox"

                               [id]="permissionRoleGroup.permission.key"
                               [formControlName]="permissionRoleGroup.permission.key"
                               [value] = "permissionRoleGroup.permission.value">
                        {{permissionRoleGroup.permission.label }}-{{permissionRoleGroup.permission.ischecked}}
                      </label>
                    </td>

                    <td width="15%" *ngFor="let role of permissionRoleGroup.roles">
                      <label class="font-light">
                        <input   type="checkbox"

                                 [value] = "role.value"
                                 [formControlName]=" role.key">
                        {{role.label}}-{{role.ischecked}}
                      </label>
                    </td>
                  </table>
                </tr>
              </table>

            </div>

有了这个，我可以构建表单，在提交过程中，我的表单没有创建 json 。

这是 plunker 链接https://plnkr.co/edit/h2VuBw4uITi6czn98ViS?p=preview

由于我是 angular-2 的初学者，所以请帮助我。