Question

我有一个 observable 流，它使用 on blur 运算符从输入 fromEvent 发出，我试图比较以前的值和当前值是否不同。

当页面第一次加载时，输入字段中没有值，此时它仍然发出空白值，如何防止这种情况？如果值不同，它将发出值。

fromEvent(this.input.nativeElement, 'blur')
   .pipe(
        takeUntil(this.unsubscribe$),
        map((evt: any) => evt.target.value),
        distinctUntilChanged(
            (pre: any, curr: any) =>
            JSON.stringify(pre) === JSON.stringify(curr)
        )
    )
    .subscribe((caption: string) => {
        console.log('value)
    })

Answer 1

你可以使用skipWhile：

  fromEvent(this.input.nativeElement, 'blur')
  .pipe(
    takeUntil(this.unsubscribe$),
    map((evt: any) => evt.target.value),
    skipWhile((text, index) => index === 0 && text === ''),
    distinctUntilChanged(
      (pre: any, curr: any) => JSON.stringify(pre) === JSON.stringify(curr)
    )
  ).subscribe((caption: string) => {
    console.log(caption);
  });

Angular distinctUntilChanged - 值比较

1 个答案: