Validaciones condicionadas y reactividad a variaciones en la UI

Por medio de una variable también podemos quitar el input de nameCompany en la vista para que cuando seleccione customer no se lo muestre.

this.typeField.valueChanges.subscribe(value => {
      if (value === 'company') {
        this.companyNameField.setValidators([Validators.required]);
        this.showCompany = true;
      } else {
        this.companyNameField.setValidators(null);
        this.showCompany = false;
      }
      this.companyNameField.updateValueAndValidity();
    });

<div *ngIf="showCompany" class="row">
          <div class="col-xs">
            <mat-form-field>
              <mat-label>Company Name</mat-label>
              <input placeholder="company" formControlName="companyName" matInput type="text"/>
            </mat-form-field>
          </div>
        </div>

Hay un detalle a tener en cuenta con las validaciones en runtime, si la validación nueva es diferente el setValidators no elimina las validaciones anteriores que pudiese tener el campo, si un campo tenia por ejemplo un min = 3 y luego le pones un max = 6 las nuevas validaciones se mezclan, es por ello que para no tener errores con las validaciones en tiempo de ejecución es recomendable ante de aplicar las nuevas validaciones a un control usar el método clearValidators, si están usando versiones de angular 10 o superiores el setValidators(null) no elimina las validaciones presentes. Esto lo aprendí a la mala cuando estaba validando un formulario muy chungo

Si tiene errores con las validaciones de un formulario este método los puede ayudar a saber que validaciones se están aplicando a un formulario

  getFormValidationErrors(form: FormGroup) {
    Object.keys(form.controls).forEach((key) => {
      const controlErrors: ValidationErrors =
        form.get(key).errors;
      if (controlErrors != null) {
        Object.keys(controlErrors).forEach((keyError) => {
           console.log(keyError);
        });
      }
    });
  }

solo hay que ejecutar el metodo en la suscripción del valuesChange del formulario y asi les mostrará que validaciones estan activas en el formulario

Ame esta clase, muy sencilla, facil de entender y facil de aplicar

una forma más corta de escribirlo:

this.companyNameField.setValidators(value === 'company' ? [Validators.required] : null);
this.companyNameField.updateValueAndValidity();