async validation reactive forms angular with ngrx

Question

I need to validate if the user exists in the state of my application. In my application I'm using ngrx and through a selector I want to validate if the user exists.

How can I do this?

I'm not able to validate this way, what am I doing wrong?

return this._formBuilder.group({
  id: ['', this._existUser()],
  dateStart: ['', Validators.required],
  dateEnd: ['', Validators.required]
})

  private _existUser(): AsyncValidatorFn {
    return (control: AbstractControl): Promise<{ [key: string]: any } | null> | Observable<{ [key: string]: any } | null> => {
      const userId = control.value;
      return this._store.select(usersSelectors.getUserById, { id: userId}).pipe(
        debounceTime(500),
        take(1),
        map(value => {
          // Not entering the map...
          return !!value ? { invalid: true } : null;
        })
      )
    };
  }

selectors.ts:

export const getUserById = createSelector(
    selectEntities,
    (entities, props): any => {
        return entities[props.id];
    }
);

Yes it is being called, and the selector works when I do subscribe. — Luiz Ricardo Cardoso
– Luiz Ricardo Cardoso, Commented Jun 5, 2019 at 13:37
I think its because this._existUser() is an async validator and should passed as the third argument — enno.void
– enno.void, Commented Jun 5, 2019 at 14:32
That was the problem, can you post here the solution for me to place as resolved? Thank you! — Luiz Ricardo Cardoso
– Luiz Ricardo Cardoso, Commented Jun 5, 2019 at 15:30

enno.void · Accepted Answer · 2019-06-05 16:15:23Z

2

The problem is that you defined this._existUser() as second parameter which is for validators or options, async-validators have to be passed as third parameter

return this._formBuilder.group({
  id: ['', [], this._existUser()],
  dateStart: ['', Validators.required],
  dateEnd: ['', Validators.required]
})

https://angular.io/api/forms/FormControl

answered Jun 5, 2019 at 16:15

enno.void

6,6284 gold badges28 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

async validation reactive forms angular with ngrx

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related