Site down, all examples using ngModel instead of reactiveForms, error integrating in a reactive form

[Sharlaan]

Hello pretty lib compatible with Angular15

... but i'm having troubles integrating it in my reactive form: (AngularMaterial15)

<form [formGroup]="appForm" (ngSubmit)="onSubmit()">
  ...
  <mat-form-field>
    <mat-label>Icon background color</mat-label>
    <input matInput ngx-colors-trigger formControlName="iconBgColor" />
  </mat-form-field>
  ...
  <mat-form-field>
    <mat-label>Icon background color</mat-label>
    <input matInput readOnly [value]="appForm.get('iconBgColor')?.value" />
    <ngx-colors matSuffix ngx-colors-trigger formControlName="iconBgColor"></ngx-colors>
  </mat-form-field>
  ...
</form>

appForm = this.fb.group<FormType<HomeApp, 'uuid'>>(
    {
      ...
      iconBgColor: this.fb.control('#FFFFFF'), // default #FFFFFF (white),
      ...
    },
    {
      updateOn: 'blur',
    },
  );

First integration errors on selecting a color with :

Second one does not error at all, but does not update the value o.O

I tried to find examples but site is down, and code examples seem to all be based on ngModel ...

What am i missing ?

[Sharlaan]

UPDATE: Second integration works but i had to change the field update mode: iconBgColor: this.fb.control('#FFFFFF', { updateOn: 'change' }), // default #FFFFFF (white)

i prefer the first integration but it does not work....

[KroneCorylus]

Site Up, thanks for the heads up. Checking the updateOn: 'blur' option now.

[Sharlaan]

Hello nice reactivity thanks ! +1

I finally made it work with this implementation :

  <div>
    <label for="color-picker">Icon Background Color</label>
    <ngx-colors
      id="color-picker"
      ngx-colors-trigger
      formControlName="iconBgColor"
      [title]="appForm.get('iconBgColor')?.value"
    ></ngx-colors>
  </div>

appForm = this.fb.group<FormType<HomeApp, 'uuid'>>(
    {
      ...
      iconBgColor: this.fb.control('#FFFFFF', { updateOn: 'change' }), // default #FFFFFF (white),
      ...
    },
    {
      updateOn: 'blur',
    },
  );

[KroneCorylus]

Added support for updateOn:'blur', Version 3.3.0. Please update and let me know if you have any problem