Question

我目前有一种方法可以搜索一些与此类似的产品数据

function search(title) {
  var result = [];
   for (i = 0; i < data.length; i++) {
          if (data[i].title.indexOf(title) > -1) {
              result.push(data[i]);
             }
        }
     return result;
}

在尝试搜索我的数据以查找其标题包含要搜索的标题的产品时，该方法有效。标题通过输入传入。

但是，我可以搜索多个属性，而不仅仅是标题。

因此，举例来说，如果我有4个输入，如标题，ID，位置，价格，您可以根据需要搜索其中的多个或少数。所以你可以一次搜索一个，偶尔搜索两个......

如何在不必编写全新功能的情况下处理此问题？会不会像

那样

function search(params) {
  var result = [];
   for (i = 0; i < data.length; i++) {
          if (look for all params being searched for here) {
              result.push(data[i]);
             }
        }
     return result;
}

编辑：只是为了展示我将如何传递数据

查看

<input ng-model="params.one">

<input ng-model="params.two">

<input ng-model="params.three">

<input ng-model="params.four">

控制器

$scope.search = function() {
   var params = $scope.params;
   // call search service which uses the above function...
}

Answer 1

因此，我们假设您的示例如下所示：

var data = [{"title": "foo", "description": "blabla", "yada": "yada"}, {..}];

现在你想打电话

search({"title": "f", "yada": "da"});

查找标题包含“f”的元素以及yadas包含“da”的所有元素。让我们分而治之。首先，我们创建一个方法，告诉我们一个项目是否与您的搜索匹配：

function matchItem(item, searchParams) {
  for(var propertyToLookFor in searchParams) {
    var valueToLookFor = searchParams[propertyToLookFor];
    if (item[propertyToLookFor].indexOf(valueToLookFor) >= 0) {
      return true;
    }
  }
  return false;
}

您需要知道的当然是for-in循环，它迭代对象的属性。并且可以像使用属性作为索引一样访问对象。因此myObject.foo与myObject['foo']相同，与var someVar = 'foo'; myObject[someVar];

相同

现在应用我们创建的匹配器最简单的方法是使用内置的filter-method of arrays：

var filteredResult = data.filter(function(item) {
  return matchItem(item, {"title": "f", "yada": "da"});
});

然而，您也可以稍微调整一下只搜索标题的方法：

function search(searchParams) {
  var result = [];
  for (i = 0; i < data.length; i++) {
    if (matchItem(data[i], searchParams)) {
      result.push(data[i]);
    }
  }
  return result;
}

AngularJS

因为你显然使用angularJS：Angular有一个built-in filter filter，它已经完成了我刚刚描述的所有内容。像这样使用它：

var filteredData = $filter('filter')(data, {"title": "f", "yada": "da"})

实际上，过滤器的API参考包含一个看起来与您尝试做的完全一样的示例，包括HTML。

Javascript搜索多个参数

1 个答案:

AngularJS