javascript - 如何在 Jquery UI 自动完成中搜索多个属性？

Question

我有一个结构与此类似的对象数组:

$scope.usersList = [{
  "name": "John",
  "email": "john@xyz.com",
  "id": "abcd"
},{
  "name": "Jane",
  "email": "jane@xyz.com",
  "id": "efgh"
}];

我在对服务器进行 ajax 调用后获取了数组。我目前正在像这样的 Angular 应用程序中使用 jQuery UI Autocomplete

$(input).autocomplete({
  source: $scope.usersList,
  appendTo: container,
  position: { 
    at: 'left bottom', 
    of: container 
  },
  select: function(e, v) {
    e.preventDefault();
    //Do something
  }
});

如果数组仅由名称组成，则上面的代码可以工作，但我也想跨“电子邮件”和“id”字段进行搜索。例如如果我在搜索框中输入“abcd”，我想在结果列表中看到约翰的名字。我不知道如何继续此操作。

Answer 1

您可以尝试按如下方式修改您的源吗:

$("#suggest").autocomplete({
        delay: 100,
        minLength:2,
        **source: function (request, response) {
            var temp = [];
                   usersList.filter(buildResponse);

                   function buildResponse(p){
                      for (var key in p) {
                      if (p.hasOwnProperty(key)) {
                       if(p[key].indexOf(request.term) > -1){
                        temp.push({
                        "label" : p[key],
                        "value" : p                     
                        });                      
                       }
                        }
                      }
                   }
                   console.log(temp);
                  response(temp); 
            }**,
        select: function (event, ui) {
        // Prevent value from being put in the input:
        this.value = ui.item.label;
        // Set the next input's value to the "value" of the item.
        console.log(ui.item);
        event.preventDefault();
        }
      });

//usersList = $scope.usersList(如您的问题中所述)

jsfiddle:http://jsfiddle.net/32Bck/501/