AngularJS - 与多个关键字匹配的搜索结果

我正在创建一个具有显示大量项目的表的仪表板。它目前有一个简单的搜索功能，允许我使用ng-model="projectSearch"搜索与该单词匹配的所有内容。这ng模型是自己插入我的ng-repeat="project in projects.data | filter : projectSearch"AngularJS - 与多个关键字匹配的搜索结果

我现在要实现的是一个搜索功能，显示所有匹配一个，两个或任何数量的关键字。我通常会发现有关显示匹配“关键字a”或“关键字b”的搜索功能的问题。

我想要搜索与'关键字a'匹配的所有项目和'关键字b'等，例如被空格或逗号分隔。

我的表包含若干字段：

<thead> 
    <tr md-row style="background-color:rgba(40,53,147,0.5)"> 
      <th md-column md-order-by="title"><span>Project Name</span></th> 
      <th md-column>ID</th> 
      <th md-column md-numeric md-order-by="total_cpi[total_cpi.length-1].cpi"> 
       <span>Status</span></th> 
      <th md-column md-numeric md-order-by="phase"><span>Phase</span></th> 
      <th md-column md-numeric md-order-by="budget_indication"> 
       <span>Budget</span></th> 
      <th md-column md-numeric md-order-by="users[0].user_name"><span>Project Manager</span> 
      </th> 
      <th md-column md-numeric md-order-by="start_date"><span>Start Date</span> 
      </th> 
      <th md-column md-numeric><span>End Date</span></th> 
     </tr> 
</thead>

我的项目对象的样子：

{ 
    "id" : 1, 
    "project_nr" : 1, 
    "title" : "x", 
    "start_date_formatted" : "01/01/2016", 
    "phase" : "x", 
    etc... 
}

我可以实现通过一个过滤器解决我的问题？

来源

2017-05-09 Lesleyvdp

你可以给你一个工作的小提琴吗？ –

@AmadouBeye我的搜索栏目前像任何常规搜索栏一样工作，例如：http://jsfiddle.net/mikeeconroy/QL28C/1/ – Lesleyvdp

您可以使用以下做一个通配符搜索：

过滤器 -

.filter('myfilter', function() { 
    return function(items, types) { 
    var filtered = []; 

    angular.forEach(items, function(item) { 
     if(types.wildcard == false || item.name.match(types.value)) { 
      filtered.push(item); 
     } 

    }); 

    return filtered; 
    }; 
});

使用创建自定义在下面的控权

$scope.projectSearch = ""; 
var pattern; 
    $scope.$watch('projectSearch', function() { 
    var pattern = '/^'+ $scope.projectSearch +'*$/' 
    }); 

$scope.types = {value: pattern};

含伍重复的

ng-repeat="project in projects.data | myfilter:types"

让我知道它是否工作。

来源

2017-05-09 11:44:16

AngularJS - 与多个关键字匹配的搜索结果

回答

相关问题