的问题：

Question

我正在使用 Angular 5 ，我制作了一个名为Select2Dropdown的Angular组件，它使用了Select2插件。

我的Select2版本为 4.0.3 。

目前据我所知，Select2仅使用本地数据进行搜索。我的目标是自定义我的Select2Dropdown以使用远程搜索。

目前，我已经设法做到这一点，但它并不好。

的问题：

1。第一个问题是，如果Select2没有加载数据（选项），则不会触发搜索事件（按键，键盘或其他）。通过在我的Select2中插入隐藏的<option>，我能够“欺骗”。

问题1：如何在没有数据的情况下更改Select2以启用搜索（keypress，keyup ..事件）？

2。第二个问题是我只知道matcher回调方法，我可以用自定义匹配函数替换它来处理自定义搜索匹配，我做了：

$('#my-select2).select2({
  . . .
  minimumResultsForSearch: 0,
  matcher: this.searchCustomers.bind(this)
});

我的matcher回调函数看起来像这样：

searchCustomers(params, data) {
  // If there are no search terms, return data
  if ($.trim(params.term) === '') {
    return data;
  }

  if (this.customerSearchParams === params.term) {
    return data;
  } else {
    this.customerSearchParams = params.term;
    this.customers = [];

    this.customerService.getCustomers()
      .subscribe(
        // Successful responses call the first callback.
        customers => {
          this.customers = customers;

          // 'trick' Select2 by reopening dropdown so it will redetect and revalidate new remote items
          $('#my-select2').select2('close');
          $('#my-select2').select2('open');

          // Get the search box within the dropdown or the selection
          const $search = $('#my-select2').data('select2').dropdown.$search 
          ||
          $('#my-select2').data('select2').selection.$search;

          $search.val(params.term); // return previous search text
     }
   });
  }

  return data;
}

因此，在每个搜索按键上，我的回调searchCustomers（）被调用，我从数据库中获取客户。这是异步方法，成功后我的Select2加载了新数据，它在搜索结果中显示新数据，但如果我选择任何一个数据，它只选择空。我设法哄骗＆＃39;通过关闭并重新打开Select2下拉列表并使用以前的值替换搜索文本来选择2。这种情况发生得如此之快以至于用户没有注意到任但问题是每次按键都会触发从数据库中取出，并且在成功时重新打开Select2，所以如果我开始在搜索中写一些单词，它会停止并继续，它会吞下我一封信。所以，如果我慢慢地写一切正常:)但那不应该是它。

问题2：我想知道如何更改仅在按回车键时触发的搜索触发事件？

总结一下：

如果没有数据，如何触发搜索？
如何仅通过按Enter键来触发搜索触发器？
非常欢迎任何其他建议!!

致以最诚挚的问候，

约瑟普布罗兹

::干杯::

选择2远程搜索

的问题：

总结一下：

0 个答案: