Мы пытаемся создать общий компонент таблицы, где элементы могут быть добавлены в таблицу или отредактированы отдельно. В таблице есть addForm
FormGroup
для редактирования элементов, прежде чем они будут добавлены в форму. Когда элемент добавляется к addForm
, он копируется в FormArray
с lodash's cloneDeep()
.Как рекурсивно скопировать на место FormGroup?
Проблема, с которой мы сталкиваемся сейчас, - это редактирование строки. Каждая строка в таблице имеет форму, связанную с editForm
, которая существует на общем компоненте. Идея состоит в том, чтобы скопировать значения из FormArray
и в editForm
, а затем сделать форму видимой для пользователя. К сожалению, у нас возникают проблемы с некоторыми из наших более сложных форм, где мы пытаемся вложить эти компоненты таблицы друг в друга. Я попробовал несколько различных подходов, но каждый из них имеет свой собственный Гоча ...
Использование _.cloneDeep()
Если я копирую из FormArray
в editForm
с _.cloneDeep() как мы используем для копирования в FormArray
, кажется, что привязки formControlName
перепутались. Я предполагаю, что это потому, что замена этого FormGroup
на место вызывает некоторые внутренние угловые ссылки на FormGroup
? Я заводиться получаю эту ошибку:
this.editForm = _.cloneDeep(this.formArray.controls[index]) as FormGroup;
Error: There is no FormControl instance attached to form control element with name: 'myControlName'
Использование patchValue()
Моя вторая попытка это использовать встроенный patchValue()
, но это выглядит как patchValue()
Безразлично» t ручка FormArray
s очень хорошо.
this.editForm.patchValue((this.formArray.controls[index] as FormGroup).getRawValue());
> this.formArray.controls[0].controls['treatingPhysicians'].controls[0].controls
- Object
- address: FormGroup
- id: FormControl
- physicianFullName: FormControl
- __proto__: Object
> this.editForm.controls['treatingPhysicians'].controls[0].controls
- []
Написание пользовательской функции копирования
У нас также есть наши собственные пользовательские формы функция копирования прокладки вокруг, к сожалению, это также, кажется, задушить на FormArray
с, так как это трудно скажите, должны ли свойства объекта в массиве быть элементом управления или другим вложенным FormGroup
.
this.editForm = this.buildOutValues((this.formArray.controls[index] as FormGroup).getRawValue(), this.editForm);
> this.formArray.controls[0].controls['treatingPhysicians'].controls[0].controls
- Object
- address: FormGroup
- id: FormControl
- physicianFullName: FormControl
- __proto__: Object
> this.editForm.controls['treatingPhysicians'].controls[0].controls
- Object
- address: FormControl
- id: FormControl
- physicianFullName: FormControl
- __proto__: Object
Так есть хороший способ, чтобы скопировать формы и сохранить все угловые ссылки в такт? Или есть способ, которым мы можем изменить наш метод копирования пользовательских форм и все еще иметь возможность отличать свойства, которые должны быть группами и которые должны быть элементами управления?
Можете ли вы поделиться функцией копирования формы, пожалуйста. Я столкнулся с одной и той же проблемой, и я, скорее всего, буду следовать той же методике реализации пользовательской копии. –