Splitting of "Enum" type in conditional types or / and string types

[robbecoessens]

Problem is when you have a enum formcontrol its gets spltted into FormControl | FormControl and not FormControl

I guess this is the same as the boolean problem.. did not test this with a number enum.

Code example: https://stackblitz.com/edit/angular-typed-forms-helpers-demo-e2sbxc

[zjkipping]

Thanks for opening this issue! I'll see if I can find time to work on this. If you find a good workaround let me know, or if you realize a good way to solve it PRs are welcome :) I am a bit busy right now unfortunately, so this might take a bit to resolve...

[zjkipping]

Hello, just commenting here that I am still aware of this issue and will try to get to it eventually. Things have been rather hectic to say the least the last few months... Apologies for any issues this might be causing in the mean time!

[zjkipping]

Hello, I can't find a solution to this problem currently since TS has no way of determining an enum from any other object. Tried my best while being in the repo to upgrade to angular v18. I'll keep the comment open for now in case something comes of this in the future. Below is my research on this issue:

A similar error also occurs for Union Types as well which is unfortunate. The generic for w/e reason expands the union type and the tricks I know of don't seem to help. Example below:

export interface Zone {
  name: string;
  type: 'zoo' | 'shelter';
  maxCapacity: number;
  animals: Animal[];
}
type ZoneForm = AngularForm<Zone>;

const zoneForm: ZoneForm = new FormGroup({
  name: new FormControl(''),
  type: new FormControl('shelter'),
  maxCapacity: new FormControl(10),
  animals: new FormArray<AnimalForm>([]),
});

Error:

Type 'FormControl<"zoo" | null> | FormControl<"shelter" | null>' is not assignable to type 'FormControl<"shelter" | null>'.
    Type 'FormControl<"zoo" | null>' is not assignable to type 'FormControl<"shelter" | null>'.
      Type '"zoo" | null' is not assignable to type '"shelter" | null'.
        Type '"zoo"' is not assignable to type '"shelter"'

Even adding an as const to the formcontrol value doesn't seem to help. Only way I got rid of the error was doing:
type: new FormControl('shelter') as FormControl<'shelter' | null> | FormControl<'zoo' | null> which is awful.

The below didn't work either:

type: new FormControl<'shelter' | 'zoo'>('shelter'),

Error:

Types of property 'controls' are incompatible.
    Type '{ name: FormControl<string | null>; type: FormControl<"zoo" | "shelter" | null>; maxCapacity: FormControl<number | null>; animals: FormArray<FormGroup<...>>; }' is not assignable to type '{ name: FormControl<string | null>; type: FormControl<"zoo" | null> | FormControl<"shelter" | null>; maxCapacity: FormControl<number | null>; animals: FormArray<...>;