diff --git a/frontend/src/app/framework/angular/forms/extended-form-array.ts b/frontend/src/app/framework/angular/forms/extended-form-array.ts index b65e5aa8b..b25dbf27e 100644 --- a/frontend/src/app/framework/angular/forms/extended-form-array.ts +++ b/frontend/src/app/framework/angular/forms/extended-form-array.ts @@ -47,16 +47,16 @@ export class UndefinableFormArray extends ExtendedFormArray { } } - public push(control: AbstractControl) { + public push(control: AbstractControl, options?: { emitEvent: false }) { this.isUndefined = false; - super.push(control); + super.push(control, options); } - public insert(index: number, control: AbstractControl) { + public insert(index: number, control: AbstractControl, options?: { emitEvent: false }) { this.isUndefined = false; - super.insert(index, control); + super.insert(index, control, options); } public setValue(value?: any[], options?: { onlySelf?: boolean; emitEvent?: boolean }) { diff --git a/frontend/src/app/framework/angular/forms/templated-form-array.spec.ts b/frontend/src/app/framework/angular/forms/templated-form-array.spec.ts index f0c42cd1c..a5a09cb90 100644 --- a/frontend/src/app/framework/angular/forms/templated-form-array.spec.ts +++ b/frontend/src/app/framework/angular/forms/templated-form-array.spec.ts @@ -150,4 +150,42 @@ describe('TemplatedFormArray', () => { expect(formTemplate.removeCalled).toEqual([]); }); + + it('should propagate value only once when multiple items are added', () => { + let changes: any[] = []; + + formArray.valueChanges.subscribe(value => { + changes.push(value); + }); + + formArray.setValue([{ value: 1 }, { value: 2 }, { value: 3 }]); + + expect(changes).toEqual([ + [ + { value: 1 }, + { value: 2 }, + { value: 3 }, + ], + ]); + }); + + it('should propagate value only once when multiple items are removed', () => { + formArray.setValue([{ value: 1 }, { value: 2 }, { value: 3 }, { value: 4 }, { value: 5 }]); + + let changes: any[] = []; + + formArray.valueChanges.subscribe(value => { + changes.push(value); + }); + + formArray.setValue([{ value: 1 }, { value: 2 }, { value: 3 }]); + + expect(changes).toEqual([ + [ + { value: 1 }, + { value: 2 }, + { value: 3 }, + ], + ]); + }); }); diff --git a/frontend/src/app/framework/angular/forms/templated-form-array.ts b/frontend/src/app/framework/angular/forms/templated-form-array.ts index 0f160a80f..ebd70a7ee 100644 --- a/frontend/src/app/framework/angular/forms/templated-form-array.ts +++ b/frontend/src/app/framework/angular/forms/templated-form-array.ts @@ -42,10 +42,10 @@ export class TemplatedFormArray extends UndefinableFormArray { super.reset(value, options); } - public add(initialValue?: any) { + public add(initialValue?: any, options?: { emitEvent: false }) { const control = this.template.createControl({}, initialValue); - this.push(control); + this.push(control, options); return control; } @@ -71,7 +71,7 @@ export class TemplatedFormArray extends UndefinableFormArray { let index = this.controls.length; while (this.controls.length < value.length) { - this.add(value[index]); + this.add(value[index], { emitEvent: false }); index++; }