Question

我们目前正在使用Angular 4应用程序中的Kendo UI自动完成功能。目前，我们允许用户输入文本，并在输入的第一个字符上立即触发自动完成查找。

我们要求在用户按下回车键之前禁用搜索。

有人知道这是否可行？

在查阅http://www.telerik.com/kendo-angular-ui/components/dropdowns/autocomplete/上的文档后，我知道我可以劫持打开操作并防止默认或者禁用查找直到X字符，但是直到按键才能显示。

我猜测on blur事件可能有用。

Answer 1

您将需要访问实际的基础HTML输入元素并附加一个keydown处理程序，然后执行自定义逻辑以防止内置过滤，直到按下Enter键，通过toggle（）方法以编程方式打开Popup，并且在Enter：

上调用搜索处理程序

ngAfterViewInit(){
  this.ac.searchbar.input.nativeElement.addEventListener('keydown', (e) => {
    if(e.which === 13){
      this.enterPressed = true;
      this.ac.toggle()
      this.handleFilter(e.target.value)
    } else {
      this.enterPressed = false;
    }
  });
}

handleFilter(value) {
  if(this.enterPressed){
    this.data = this.source.filter((s) => s.toLowerCase().indexOf(value.toLowerCase()) !== -1); 
  } 
}

onOpen(e){
  if(!this.enterPressed){
    e.preventDefault();
  }
}

EXAMPLE

在输入按键时触发的Angular 4数据搜索的Kendo UI自动完成功能

1 个答案: