Avoid undefined in TypedForms in Angular

Issue

I have the following code:

  readonly form = new FormGroup({
    summary: new FormControl<string>('', { nonNullable: true, validators: Validators.required }),
    description: new FormControl<string>('', { nonNullable: true, validators: Validators.required }),
  });

I have a form with two required fields and nullable is turned off. Now i have the issue, that the type is still, string | undefined instead of string if i access this.form.value.description before each using and without using !.

Any idea how i can achieve this without the need to check each property?

Solution

The solution @Eugene provided is not wrong, but we'Ve found another way. It is hard to say if it is the better one.

Instead of this.form.value i use this.form.getRawValue().

The reason why the properties in this.form.value are potential undefined is that the control could be disabled. In this case no value is provided.

Answered By - Thomas Renger