Angular 使用去BounceTime&；订阅FormBuilder valueChanges时distinctUntilChanged不起作用

简单地说，我想在用户停止输入一段时间后执行查询。我看过的每个使用

FormBuilder

的教程都建议订阅输入字段的

valueChanges

，同时使用管道

debounceTime

和

distinctUntilChanged

this.threadForm.get('body').valueChanges.pipe(
            debounceTime(500),
            distinctUntilChanged(),
            mergeMap(search => this.db.query$(...)`))
      )

我不能让它正常工作。它似乎可以正确地消除时间的抖动，但当它通过管道传输时，它会发送多个最终结果（distinctUntilChanged应该处理这些结果）。我做错了什么

下面是问题的快速视频（我添加了一个

点击

，以便您可以看到该网页正在记录一些最终结果）：

谢谢

编辑：添加周围代码每次按键都会运行

源代码

功能，因此我认为无论我如何去抖动，我都在实例化多个观察值。如何在其中添加去盎司逻辑

  source: (searchTerm, renderList) => {
    //searchTerm is triggered on every button click
    if (searchTerm.length === 0) {
      renderList(this.mentions, searchTerm)
    } else {
      //are multiple instances of this observable being made??
      this.threadForm.get('body').valueChanges.pipe(
        distinctUntilChanged(),
        debounceTime(500),
        tap(x => console.log(x)),
        switchMap(search => this.db.query$(`user/collection?like=username_${searchTerm}&limit=5`))
      ).subscribe( x => {
        console.log(x)
      });
    }
  },

试试这个：

this.threadForm.get('body').valueChanges.pipe(
  debounceTime(1000), 
  distinctUntilChanged()).subscribe(changes => {
  this.db.query$(...)
});

---

我很确定这里的问题与

valueChanges

发出的对象有关。对于

distinctUntilChanged

发射的对象不同，您可能希望首先将此对象映射到实际需要的值。（您还可以将回调交给，以控制要区分的内容）

e、 g

您肯定在寻找

switchMap

over

mergeMap

编辑

为了使用源函数，您可以使用这样的主题

var searchSubject = new Subject<any>();

source: (searchTerm, renderList) => {
  searchSubject.next({searchTerm, renderList});
}

---

使用

switchMap（）

而不是

mergeMap（）

此外，为了更好地使用，还可以反转去抖动和区分performance@xyz刚刚尝试了

开关映射

，同样的结果：/所以我认为我发现了问题，但我正在努力找出解决方法……围绕着这个可观察到的是一个名为

source

的函数，它也会在键入的每封信上触发，因为我在问题中发布的可观察到的内容就在里面，我想我在键入时实例化了多个观测值，因此即使我有去抖动等，它仍然返回多个。我将更新我的问题，以便您可以看到周围的代码，

searchTerm

是在每次按键时传递到内部的代码。您不应该在每次按键时运行此代码，您需要在init函数

ngOnInit（）

中创建一次观察者，然后在

ngDestroy（）

中取消订阅，这样一来，我只知道一个问题，

源代码

函数来自我正在使用的库，这就是为什么我这里的问题正是你所说的哈哈，我想使用可观察的，但我需要在

源

函数中包含可观察的，因为我需要在该范围内调用回调函数来触发结果显示啊，好吧，我被threadFrom订阅搞糊涂了，我以为你在使用反应式表单。如果来源是一个固定的东西，你可以从主题中得到，我会更新我的答案。你是正确的，我使用的是反应形式：）我试图使用RF的

值更改
来检测某个时间过去了，但事实上，每一个字母都会触发
源代码
，并创建一个新的可观察实例，这一切都搞砸了哈哈。期待您的更新！
var searchSubject = new Subject<any>();

source: (searchTerm, renderList) => {
  searchSubject.next({searchTerm, renderList});
}

searchSubject.pipe(
 debounceTime(500),
 distinctUntilChanged(),
 mergeMap(search => this.db.query$(...)`))
)