Question

我有一个文本框作为输入元素，并且想知道用户何时停止键入以进行REST调用。我阅读了一些在keyup上使用setTimeout的文章；但是，然后用户在一定时间内停止了键入操作，我看到API被调用了很多次（取决于键入内容的长度）。是否还有其他方法可以检测到用户已停止键入以进行API调用？

Answer 1

好的，这肯定会帮助您，并且非常易于使用：-

debounceTime

debounceTime将源Observable发出的值延迟为您指定为其参数的时间（以毫秒为单位）。

-index.ts-

import { fromEvent } from 'rxjs';
import { debounceTime, map } from 'rxjs/operators';

// elem ref
const searchBox = document.getElementById('search');

// streams
const keyup$ = fromEvent(searchBox, 'keyup')

// wait .5s between keyups to emit current value
keyup$.pipe(
  map((i: any) => i.currentTarget.value),
  debounceTime(500)
)
.subscribe((value) => {
  console.log('value is', value);
});

-index.html-

<input type="text" id="search" />

现在在订阅正文中，您可以进行api调用。

角度：检测用户何时停止输入

1 个答案: