ng2-semantic-ui icon indicating copy to clipboard operation
ng2-semantic-ui copied to clipboard

timeout for optionsLookup

Open genuinefafa opened this issue 7 years ago • 2 comments

When using optionsLookup for <sui-select one can probably use an API call, currently, the call is being made for each key typed that increase significantly roundtrips to server without actually needing it. Not even Google does it. :)

Also, what is going on behind the hood for those canceled API calls? it seems that all of them should be canceled and not let them run loose.

genuinefafa avatar Aug 01 '17 20:08 genuinefafa

If it helps - I fixed this locally for my project by using this code for my "optionsLookup" function

return new Promise((resolve, reject) => {
    if (searchString.length < 3) {
        reject(null);
    } else {
        clearTimeout(this.searchDelay);
        this.searchDelay = setTimeout(() => {
            this.searching = true;
            this.dataService.searchEntities(APIPath.patients, searchString).then((res) => {
                this.searching = false;
                resolve(res.data);
            });
        }, 200);
    }
});

The only missing piece is that the dropdown stays open and says "No Results" while the search is processing, but it is a good workaround!

gabrieldoty avatar Mar 26 '18 23:03 gabrieldoty

hi @gabrieldoty! i'm currently having something like that.

  public opcionesLookup = async (query: string, initial: string) => {
    if (initial !== undefined) {
      return this.service.get(initial);
    }

    return this.servicePromise(query);
  }

  servicePromise(query) {
    const promise = new Promise((resolve, reject) => {
      if (this._subscriptionTimer) {
        this._subscriptionTimer.unsubscribe();
      }

      const timer = Observable.timer(1000);
      this._subscriptionTimer = timer.take(1).subscribe( t => {
        this.service.search(query).subscribe( r => {
          return resolve(r);
        }, (error) => {
          return reject(error);
        })
      })
    });
    return promise;
  }

i'm not entirely sure if this is the way to go since I'm experiencing some strange behavior when user is typing fast, then slow, then fast... query sometimes misses the last letter 😢

genuinefafa avatar Mar 27 '18 20:03 genuinefafa