angular - Modellstyrt skjema Nestet FormArray-kontroll i en FormGroup-kontroll

Jeg har en skjema-gruppe som følger:

 this.form = fb.group({
  'teacher': [''],
  'schools': fb.array([
      fb.group({
        'school_name': [''],
        'school_description': [''],
        'events': fb.array([
          fb.group({
            'event_name': ['']
          })
        ])
      })
  ])
});
const control = (<FormArray>this.form.controls['schools']).controls[0]['events'];

Hvordan får jeg tilgang til den nestede array-kontrollen 'events'?

const control = (<FormArray>this.form.controls['schools']).controls[0]['events'];

Svar #1

Jeg anbefaler å se på Angular 2-eksemplene for nestet form-array og nestet form-gruppe for å se hvordan man bygger komplekse skjemaer. Med FormGroup kan du bruke .get(name: string) for å hente en kontroll. Dette eksempelet henter schools FormArray-kontrollen:

this.form.get('schools')

For FormArray kan du hente en kontroll fra arrayet ved å bruke .at(index: number). Dette eksemplet henter den første FormGroup-kontrollen i arrayet:

this.schools.at(0)

For å sette det hele sammen finnes det finere (les: mer gjenbrukbare, mer lesbare) måter å uttrykke dette på, men denne kjeden vil gi deg den første hendelsen fra din første skole:

this.form.get('schools').at(0).get('events')

Her er et fungerende plnkr-eksempel.

Svar #2

Du bør bruke denne koden:

      let listForm: any;
      var subFormGroup = new FormGroup({});
        subFormGroup.addControl("Your Controll Name", new FormControl('',res["Required"] ? Validators.required : null))

      listForm = this.builder.array([
        subFormGroup
      ]);
      this.form.addControl("Your new ArrayControll Name", listForm);

Når du har et array av objekter, kan du bruke det:

 let listForm: any;
 var controlItems =[Your Object Array];
 var subFormGroup = new FormGroup({});
 Object.keys(controlItems).forEach(function(key){
    subFormGroup.addControl(controlItems[key], new FormControl('',res["Required"] ? Validators.required : null))
  })
 listForm = this.builder.array([
     subFormGroup
 ]);
 this.form.addControl("Your new ArrayControll Name", listForm);

Relaterte artikler