fix: correct FormGroup array types with fields

timdeschryver · Feb 6, 2024 · 013929c · 013929c
1 parent 90d7705
commit 013929c
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 2 deletions.
diff --git a/apps/example/src/app/simple-form/simple-form.component.ts b/apps/example/src/app/simple-form/simple-form.component.ts
@@ -63,7 +63,16 @@ import { CustomErrorComponent } from '../custom-input-error.component';
           />
         </div>
 
-        <div>
+        <fieldset>
+          <legend>Team members</legend>
+          <div *ngFor="let member of form.controls.team.controls(); let i = index;">
+              <label for="member-{{i}}">Member</label>
+              <input ngModel [formField]="member" id="member-{{i}}" />
+          </div>
+        </fieldset>
+
+        <fieldset>
+          <legend>Todos</legend>
           <button (click)="addTodo()">Add todo</button>
           <small>{{ form.controls.todos.errors() | json }}</small>
 
@@ -77,7 +86,7 @@ import { CustomErrorComponent } from '../custom-input-error.component';
             />
             <input ngModel [formField]="todo.controls.description" />
           </div>
-        </div>
+        </fieldset>
 
         <button (click)="form.markAllAsTouched()">Mark all as touched</button>
         <button (click)="reset()">Reset form</button>
@@ -168,7 +177,14 @@ export default class SimpleFormComponent {
           validators: [V.minLength(1)],
         }
       ),
+
+      team:  this.sfb.createFormGroup([
+        this.sfb.createFormField(''),
+        this.sfb.createFormField(''),
+        this.sfb.createFormField(''),
+      ]),
     };
+
   });
 
   createTodo = () => {

diff --git a/packages/platform/src/lib/form-group.ts b/packages/platform/src/lib/form-group.ts
@@ -29,6 +29,8 @@ export type FormGroup<Fields extends FormGroupCreatorOrSignal = {}> = {
   value: Signal<UnwrappedFormGroup<Fields>>;
   controls: Fields extends WritableSignal<FormGroup<infer G>[]> 
     ? FormGroupFields<Fields> & WritableSignal<FormGroup<G>[]> 
+    : Fields extends WritableSignal<infer F> 
+    ? FormGroupFields<Fields> & WritableSignal<F> 
     : FormGroupFields<Fields>;
   valid: Signal<boolean>;
   state: Signal<ValidationState>;