`
gwj41
  • 浏览: 97767 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

Angular调用redis实现输入框自动提示

 
阅读更多

其实用Elasticsearch比较完美,redis的版本只能从开头的字符匹配,但是ELK还不会,准备学学,先用redis实现下,redis返回的提示信息的list,就省略不写了。

页面代码片段

 

	<div>
		<label for="autocomplete">Auto complete</label>
		<input id="autocomplete" type="text" (keyup)="onKey($event)" />
	</div>

 

  timeout;
  onKey(event: any) {
    // 取消上一次的timeout设置
    clearTimeout(this.timeout);
    // 延迟3秒
    this.timeout = setTimeout(() => this.getSuggestion(event), 3000);
  }

  getSuggestion(event: any) {
    const token = localStorage.getItem('token');
    const word = event.target.value;
    if (!word) {
      return;
    }
    const url = 'http://localhost:8764/api/v1/user/redis/project/autoSuggest/' + word;
    let headers: HttpHeaders = new HttpHeaders();
    headers = headers.set('Content-Type', 'application/json')
    // .set('Accept', 'application/json')
    .set('Authorization', 'Bearer ' + token)
    this.http.get(url, {headers: headers}).subscribe(data => {
      const additionalInfo = data['additionalInfo'];
      // console.log(additionalInfo)
      if (additionalInfo === null) {
        return;
      }
      const suggest = additionalInfo['suggest'];
      if (suggest) {
        console.log(suggest);
      }
    }, (error: HttpErrorResponse) => {
      console.log(error.error);
    });
  }

 

 

 

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics