Обнаружение изменений в группе форм с несколькими экземплярами определенного значения

avatar
tjw2811
8 августа 2021 в 19:19
188
1
0

Заранее приношу свои извинения, если что-то из того, что я говорю, не имеет смысла, так как я новичок в программировании. Не стесняйтесь исправлять меня/просить разъяснений по поводу чего-либо двусмысленного.

У меня есть код, который определяет изменение следующим образом:

    this.myForm.get('terminal.**0**.sparePartCost')?.valueChanges.subscribe(x => {
        ...some function executes
    })

Если мне нужно добавить еще один экземпляр группы форм, я бы получил доступ к этому экземпляру с помощью 1, а не 0:

    this.myForm.get('terminal.**1**.sparePartCost')?.valueChanges.subscribe(x => {
        ...some function executes
    })
    

Мне нужно иметь возможность сделать это, но на неопределенное количество. Другими словами, есть ли способ получить к нему доступ, чтобы он определял, на какую группу форм я ссылаюсь. Например:

    this.myForm.get('terminal.**X**.sparePartCost')?.valueChanges.subscribe(x => {
        ...some function executes based on the value of X
    })

Заранее спасибо :)

Источник
scy
8 августа 2021 в 19:26
0

попробуйте formArrays. Если вы инициируете свою группу форм с помощью инъекции angulars formBuilder, вы можете просто заменить команду на что-то вроде: this._formBuilder.array([]). результирующий массив можно изменить, исправив новые элементы formControl, такие как this.myForm.push(new FormControl()); (или this.formBuilder.group({}) для вложенных групп форм. Затем можно повторять Formarrays, подписываясь на valueChanges внутри цикла for. Хотя я почти уверен (хотя еще не проверял), что formArrays valueChange срабатывает на любое изменение значения массива формы

Ответы (1)

avatar
Eliseo
8 августа 2021 в 21:09
0

Tj, get('name.'+index+'.property') используется для управления FormArray. FormArray может быть FormArray из FormControls (не ваш случай) или FormArray из FormGroup.

Для управления FormArray из FormGroup мы создаем функцию, которая возвращает formArray

  get terminalFormArray(){
    return this.myForm?this.myForm.get('terminal') as FormArray:null
  }

Обычно используется функция, которая возвращает FormGroup, я думаю, что-то вроде

getGroup():FormGroup{
  return new FormGroup({
       sparePartCost:new FormControl(),
       otherField:new FormControl()
  })
}

Чтобы сделать что-то вроде

   myForm=new FormGroup({
       terminal:new FormArray(
           this.getGroup(),
           this.getGroup()
       )
   })

Но если вы хотите контролировать изменения поля в formArray, вы можете определить функцию createGroup, например

getGroup(index):FormGroup{

  index=index || (this.terminalFormArray?this.terminalFormArray.length:0)

  constr group=new FormGroup({
       sparePartCost:new FormControl(),
       otherField:new FormControl()
  })
  group.get('sparePartCost').valueChanges.subscribe(res=>{
         ..make something with the res and index..
       console.log(res,index)
  })
  return group;
}

И вы используете as

   myForm=new FormGroup({
       terminal:new FormArray(
           this.getGroup(0),
           this.getGroup(1)
       )
   })

или

   this.terminalFromArray.push(this.getGroup())

См. stackblitz