Angular/TypScript: Create type for Form based on Model

I have a model like this:

interface User {
firstName: string;
lastName: string;
gender: 'male' | 'female';
}


I want a generic way to create the type of a Angular-Form based on this model. My first approach:

export type ModelForm<T> = FormGroup<{
[K in keyof T]: FormControl<T[K]>;
}>


I can do type my UserModelForm like this const myForm: ModelForm<User> and everything is correct.

But what if my Model has Arrays and Objects in it. For Example:

interface User {
firstName: string;
lastName: string;
gender: 'male' | 'female';
validity: {
validFrom: Date,
validUntil: Date | null,
}
addresses: {street: string, houseNumber:number}[],
}


How can I handle this?

Continue reading...