javascript - AngularJS:在 ng-model 上搜索多个值

标签 javascript angularjs angularjs-ng-model

我一直在寻找解决方案,但找不到确切的场景。我想知道有人可以帮忙。我有这样的 ng-repeat 过滤器列表:

<ul>   
  <li ng-repeat="f in filterOptions">
  <p>{{f.group}}</p>   
    <ul>
      <li ng-repeat="o in f.options">
        <input id="{{$parent.f.filtername}}{{$index}}" type="checkbox" ng-model="Filter.category[o.title]" ng-true-value="{{o.title}}" ng-false-value=""  />
      </li>
    </ul>
  </li>
</ul>

我的 JSON:

[
  {
    "group": "Product Categories",
    "filtername" : "category",
    "options": [
        {
            "title": "Category A",
            "alt_titles": ["Category B, Category C"]
        },
        {
            "title": "Category 1",
            "alt_titles": ["Category 2, Category 3"]
        }
    ]
  }
]

这样,我就可以成功搜索属于 o.titles 的项目。现在,我想知道我应该做什么才能搜索也属于 alt_titles 的项目。

例如:如果我单击类别 A,它还会循环显示类别 B 和类别 C 的项目。与类别 1 相同,它应该显示类别 2 和类别 3 的项目。

我希望我说得清楚。请帮忙。谢谢!

<小时/>

工作示例 FIDDLE

最佳答案

在这种情况下,您需要一个自定义过滤器。此处的文档:https://docs.angularjs.org/tutorial/step_09我在这里的例子:http://plnkr.co/edit/lzyo5cTMd6FUzYw9JSq8

app.filter('MultiValueFilter',function(){
return function(list, queries){
  var result = [];
  var queries_regex = [];
  angular.forEach(queries, function(query){
    queries_regex.push(new RegExp('^' + escapeRegExp(query),'i'));
  });

  angular.forEach(list, function(item){
    for(var i = 0; i < queries_regex.length; ++i){
      if(queries_regex[i].test(item)){
        result.push(item);
        break;
      }
    }
  });
  return result;
  };
});

基本上,这个函数循环遍历列表中的每个项目,针对正则表达式列表对其进行测试,如果它与其中一个正则表达式匹配,则将其插入结果中。

关于javascript - AngularJS:在 ng-model 上搜索多个值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29357539/

相关文章:

javascript - 在 node.js 中访问 MySQL 数据库 - 内部断言失败

javascript - AngularJS:我应该使用过滤器将整数值转换为百分比吗?

angularjs - Angular 中的CSS不起作用

javascript - Protractor,登录到asp,net MVC登录页面,然后等待默认页面,重定向到 Angular 页面并进行测试......如何?

javascript - document.ready 时显示模式对话框

java - 当我从 struts2 操作的 js 函数中获取 JSONArray 时,它是空的,我不明白为什么

javascript - 清除数组后不会更新 ng-options 绑定(bind)变量

javascript - 使用 ng-model 绑定(bind)时保留自定义对象类型

javascript - 在 AngularJS 中需要 ngModel 语法

javascript - 如何在 JSDoc 中记录解构参数?