cloudnc · maxime1992 · Apr 7, 2020
diff --git a/README.md b/README.md
@@ -324,7 +324,7 @@ export class VehicleProductComponent extends NgxSubFormRemapComponent<OneVehicle
     };
   }
 
-  protected transformFromFormGroup(formValue: OneVehicleForm): OneVehicle | null {
+  protected transformFromFormGroup(formValue: OneVehicleForm): NoExtraProperties<OneVehicle, OneVehicleForm> | null {
     switch (formValue.vehicleType) {
       case VehicleType.SPEEDER:
         return formValue.speeder;
@@ -381,7 +381,7 @@ export class VehicleProductComponent extends NgxSubFormRemapComponent<OneVehicle
     };
   }
 
-  protected transformFromFormGroup(formValue: OneVehicleForm): OneVehicle | null {
+  protected transformFromFormGroup(formValue: OneVehicleForm): NoExtraProperties<OneVehicle, OneVehicleForm> | null {
     switch (formValue.vehicleType) {
       case VehicleType.SPEEDER:
         return formValue.speeder;
@@ -441,7 +441,7 @@ export class CrewMembersComponent extends NgxSubFormRemapComponent<CrewMember[],
     };
   }
 
-  protected transformFromFormGroup(formValue: CrewMembersForm): CrewMember[] | null {
+  protected transformFromFormGroup(formValue: CrewMembersForm): NoExtraProperties<CrewMember[], CrewMembersForm> | null {
     return formValue.crewMembers;
   }
 

diff --git a/projects/ngx-sub-form/src/lib/ngx-root-form.component.spec.ts b/projects/ngx-sub-form/src/lib/ngx-root-form.component.spec.ts
@@ -6,7 +6,7 @@ import { BehaviorSubject } from 'rxjs';
 import { TestBed, async, ComponentFixture, fakeAsync, tick } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { DataInput } from './ngx-sub-form.decorators';
-import { NgxFormWithArrayControls } from './ngx-sub-form.types';
+import { NgxFormWithArrayControls, NoExtraProperties } from './ngx-sub-form.types';
 
 interface Vehicle {
   color?: string | null;
@@ -209,7 +209,7 @@ class RootFormArrayComponent extends NgxRootFormComponent<Vehicle[], VehiclesArr
     };
   }
 
-  protected transformFromFormGroup(formValue: VehiclesArrayForm): Vehicle[] | null {
+  protected transformFromFormGroup(formValue: VehiclesArrayForm): NoExtraProperties<Vehicle[], VehiclesArrayForm> | null {
     return formValue.vehicles;
   }
 

diff --git a/projects/ngx-sub-form/src/lib/ngx-root-form.component.ts b/projects/ngx-sub-form/src/lib/ngx-root-form.component.ts
@@ -4,6 +4,7 @@ import { BehaviorSubject, Subject } from 'rxjs';
 import { filter, tap } from 'rxjs/operators';
 import { NgxSubFormRemapComponent } from './ngx-sub-form.component';
 import { takeUntilDestroyed, isNullOrUndefined } from './ngx-sub-form-utils';
+import { NoExtraProperties } from './ngx-sub-form.types';
 
 @Directive()
 // tslint:disable-next-line: directive-class-suffix
@@ -90,8 +91,8 @@ export abstract class NgxRootFormComponent<ControlInterface, FormInterface = Con
     return (obj as unknown) as FormInterface;
   }
 
-  protected transformFromFormGroup(formValue: FormInterface): ControlInterface | null {
-    return (formValue as unknown) as ControlInterface;
+  protected transformFromFormGroup(formValue: FormInterface): NoExtraProperties<ControlInterface, FormInterface> | null {
+    return (formValue as unknown) as NoExtraProperties<ControlInterface, FormInterface>;
   }
 
   public manualSave(): void {

diff --git a/projects/ngx-sub-form/src/lib/ngx-sub-form.component.spec.ts b/projects/ngx-sub-form/src/lib/ngx-sub-form.component.spec.ts
@@ -11,6 +11,7 @@ import {
   ArrayPropertyKey,
   ArrayPropertyValue,
   NgxFormWithArrayControls,
+  NoExtraProperties,
 } from '../public_api';
 import { Observable } from 'rxjs';
 
@@ -566,7 +567,7 @@ class SubRemapComponent extends NgxSubFormRemapComponent<Vehicle, VehicleForm> {
     };
   }
 
-  protected transformFromFormGroup(formValue: VehicleForm): Vehicle | null {
+  protected transformFromFormGroup(formValue: VehicleForm): NoExtraProperties<Vehicle, VehicleForm> | null {
     return {
       color: formValue.vehicleColor,
       canFire: formValue.vehicleCanFire,
@@ -668,7 +669,7 @@ class SubArrayComponent extends NgxSubFormRemapComponent<Vehicle[], VehiclesArra
     };
   }
 
-  protected transformFromFormGroup(formValue: VehiclesArrayForm): Vehicle[] | null {
+  protected transformFromFormGroup(formValue: VehiclesArrayForm): NoExtraProperties<Vehicle[], VehiclesArrayForm> | null {
     return formValue.vehicles;
   }
 

diff --git a/projects/ngx-sub-form/src/lib/ngx-sub-form.component.ts b/projects/ngx-sub-form/src/lib/ngx-sub-form.component.ts
@@ -24,7 +24,7 @@ import {
   TypedAbstractControl,
   TypedFormGroup,
 } from './ngx-sub-form-utils';
-import { FormGroupOptions, NgxFormWithArrayControls, OnFormUpdate } from './ngx-sub-form.types';
+import { FormGroupOptions, NgxFormWithArrayControls, OnFormUpdate, NoExtraProperties } from './ngx-sub-form.types';
 
 type MapControlFunction<FormInterface, MapValue> = (
   ctrl: TypedAbstractControl<any>,
@@ -340,8 +340,8 @@ export abstract class NgxSubFormComponent<ControlInterface, FormInterface = Cont
 
   // that method can be overridden if the
   // shape of the form needs to be modified
-  protected transformFromFormGroup(formValue: FormInterface): ControlInterface | null {
-    return (formValue as any) as ControlInterface;
+  protected transformFromFormGroup(formValue: FormInterface): NoExtraProperties<ControlInterface, FormInterface> | null {
+    return (formValue as any) as NoExtraProperties<ControlInterface, FormInterface>;
   }
 
   public registerOnChange(fn: (_: any) => void): void {
@@ -437,5 +437,5 @@ export abstract class NgxSubFormRemapComponent<ControlInterface, FormInterface>
     obj: ControlInterface | null,
     defaultValues: Partial<FormInterface> | null,
   ): FormInterface | null;
-  protected abstract transformFromFormGroup(formValue: FormInterface): ControlInterface | null;
+  protected abstract transformFromFormGroup(formValue: FormInterface): NoExtraProperties<ControlInterface, FormInterface> | null;
 }
diff --git a/projects/ngx-sub-form/src/lib/ngx-sub-form.types.ts b/projects/ngx-sub-form/src/lib/ngx-sub-form.types.ts
@@ -41,3 +41,12 @@ export interface FormGroupOptions<T> {
 export interface NgxFormWithArrayControls<T> {
   createFormArrayControl(key: ArrayPropertyKey<T>, value: ArrayPropertyValue<T>): FormControl;
 }
+
+type Impossible<K extends keyof any> = {
+  [P in K]?: undefined | never;
+};
+
+export type NoExtraProperties<T, U> = U extends Array<infer V>
+  ? NoExtraProperties<V, V>[]
+  : Omit<U, keyof Impossible<Exclude<keyof U, keyof T>>>
+  // & Impossible<Exclude<keyof U, keyof T>>;
diff --git a/src/app/main/listing/listing-form/droid-listing/droid-product.component.ts b/src/app/main/listing/listing-form/droid-listing/droid-product.component.ts
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 import { FormControl, Validators } from '@angular/forms';
-import { Controls, NgxSubFormRemapComponent, subformComponentProviders } from 'ngx-sub-form';
+import { Controls, NgxSubFormRemapComponent, subformComponentProviders, NoExtraProperties } from 'ngx-sub-form';
 import {
   AssassinDroid,
   AstromechDroid,
@@ -52,7 +52,7 @@ export class DroidProductComponent extends NgxSubFormRemapComponent<OneDroid, On
     };
   }
 
-  protected transformFromFormGroup(formValue: OneDroidForm): OneDroid | null {
+  protected transformFromFormGroup(formValue: OneDroidForm): NoExtraProperties<OneDroid, OneDroidForm> | null {
     switch (formValue.droidType) {
       case DroidType.PROTOCOL:
         return formValue.protocolDroid;

diff --git a/src/app/main/listing/listing-form/listing-form.component.ts b/src/app/main/listing/listing-form/listing-form.component.ts
@@ -7,6 +7,7 @@ import {
   // NGX_SUB_FORM_HANDLE_VALUE_CHANGES_RATE_STRATEGIES,
   DataInput,
   NgxRootFormComponent,
+  NoExtraProperties,
 } from 'ngx-sub-form';
 import { tap } from 'rxjs/operators';
 import { ListingType, OneListing } from 'src/app/interfaces/listing.interface';
@@ -64,7 +65,7 @@ export class ListingFormComponent extends NgxRootFormComponent<OneListing, OneLi
     };
   }
 
-  protected transformFromFormGroup(formValue: OneListingForm): OneListing | null {
+  protected transformFromFormGroup(formValue: OneListingForm): NoExtraProperties<OneListing, OneListingForm> | null {
     const { vehicleProduct, droidProduct, listingType, ...commonValues } = formValue;
 
     switch (listingType) {

diff --git a/src/app/main/listing/listing-form/vehicle-listing/crew-members/crew-members.component.ts b/src/app/main/listing/listing-form/vehicle-listing/crew-members/crew-members.component.ts
@@ -7,6 +7,7 @@ import {
   ArrayPropertyKey,
   ArrayPropertyValue,
   NgxFormWithArrayControls,
+  NoExtraProperties,
 } from 'ngx-sub-form';
 import { CrewMember } from '../../../../../interfaces/crew-member.interface';
 
@@ -40,7 +41,7 @@ export class CrewMembersComponent extends NgxSubFormRemapComponent<CrewMember[],
     };
   }
 
-  protected transformFromFormGroup(formValue: CrewMembersForm): CrewMember[] | null {
+  protected transformFromFormGroup(formValue: CrewMembersForm): NoExtraProperties<CrewMember[], CrewMembersForm> | null {
     return formValue.crewMembers;
   }
 

diff --git a/src/app/main/listing/listing-form/vehicle-listing/vehicle-product.component.ts b/src/app/main/listing/listing-form/vehicle-listing/vehicle-product.component.ts
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 import { FormControl, Validators } from '@angular/forms';
-import { Controls, NgxSubFormRemapComponent, subformComponentProviders } from 'ngx-sub-form';
+import { Controls, NgxSubFormRemapComponent, subformComponentProviders, NoExtraProperties } from 'ngx-sub-form';
 import { OneVehicle, Spaceship, Speeder, VehicleType } from 'src/app/interfaces/vehicle.interface';
 import { UnreachableCase } from 'src/app/shared/utils';
 
@@ -39,7 +39,7 @@ export class VehicleProductComponent extends NgxSubFormRemapComponent<OneVehicle
     };
   }
 
-  protected transformFromFormGroup(formValue: OneVehicleForm): OneVehicle | null {
+  protected transformFromFormGroup(formValue: OneVehicleForm): NoExtraProperties<OneVehicle, OneVehicleForm> | null {
     switch (formValue.vehicleType) {
       case VehicleType.SPEEDER:
         return formValue.speeder;

diff --git a/src/readme/vehicle-product.component.simplified.ts b/src/readme/vehicle-product.component.simplified.ts
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 import { FormControl, Validators } from '@angular/forms';
-import { Controls, NgxSubFormRemapComponent, subformComponentProviders } from 'ngx-sub-form';
+import { Controls, NgxSubFormRemapComponent, subformComponentProviders, NoExtraProperties } from 'ngx-sub-form';
 import { VehicleType } from '../app/interfaces/vehicle.interface';
 import { UnreachableCase } from '../app/shared/utils';
 
@@ -58,7 +58,7 @@ export class VehicleProductComponent extends NgxSubFormRemapComponent<OneVehicle
     };
   }
 
-  protected transformFromFormGroup(formValue: OneVehicleForm): OneVehicle | null {
+  protected transformFromFormGroup(formValue: OneVehicleForm): NoExtraProperties<OneVehicle, OneVehicleForm> | null {
     switch (formValue.vehicleType) {
       case VehicleType.SPEEDER:
         return formValue.speeder;