AngularJS去抖不按预期工作

时间:2016-12-19 13:48:06

标签: javascript angularjs observable

我需要回到很久以前的AngularJS项目(如果你深入Angular 2,那将是多么痛苦)。我需要通过在模型更改上使用去抖来替换搜索栏输入,因为我们拥有比当时更多的流量。可以在每次击键时发送请求,但这对我们现在拥有的访客数量来说是不可接受的。

在Angular 2中,rxjs的去抖将解决我的问题,但在AngularJS中,它没有按预期工作。虽然这个错误对我的工作流程并不重要,但我只是好奇这是否确实是预期的行为。

在rxjs中,辩论会做的是:

User interactions(keystrokes, each dash represents 100ms)
1--2---3----4-5-6-7----8-----9-----
1----2----3----5----7----8----9----
^ .debounceTime(500)

正如您所看到的,动作4和6将被忽略,因为它们将被它们之后触发的动作(以500ms的时间跨度)取代。

但是在AngularJS中,使用ng-model-options="{ debounce: 500 }",我得到:

User interactions(keystrokes, each dash represents 100ms)
1--2---3----4-5-6-7----8-----9-----
1----------------------8-----9-----
^ AngularJS

在此示例中,只要有500毫秒的虚无,AngularJS就会选择更改。动作1 - 8之间的持续时间小于500毫秒,因此在该持续时间内的更改永远不会更新。这是预期的行为吗?

1 个答案:

答案 0 :(得分:1)

每次用户更改输入时,都会重置去抖定时器。 From the Angular docs:

  

updateOn和debounce属性允许您指定将触发模型更新和/或去抖动延迟的自定义事件列表,以便实际更新仅在计时器到期时发生; 此计时器将在发生另一次更改后重置