Search code examples
observabledistinct-valuesrxjs6

distinctUntilChanged set initial value


For rxjs, can I provide an initial value when using distinctUntilChanged? It seems that the equals check is skipped entirely when no previous value was received. I'd like to not emit anything when the first value it receives is the initial value.


Use case

In my case I'm working with angular, I'm working with reactive forms and subscribing to its value changes. Since it's an input field I have a typical pipe setup:

  • debounceTime(350)
  • distinctUntilChanged()

When the user changes the initial field from empty to something and then empty again within the debounce time, the event is triggered anyway which should not happen.


What I've tried

  • Supply a custom equals method in distinctUntilChanged
    • Does not work since the pipe is skipped entirely when encoutered for the first time
  • Force a next on the underlying subject with the default value
    • This still emits a value after the debounce time which I'd rather avoid

Solution

  • You can try startWith:

    const valueChanges$ = this.form
      .get('CONTROL_NAME')
      .valueChanges
      .pipe(
        startWith('INITIAL_VALUE'),
        distinctUntilChanged(),
        skip(1)
      )
      .subscribe((value: string) => { ... });