当前位置: 首页 > 面试题库 >

使用搜索输入字段过滤ng-repeat中的嵌套对象

沈思博
2023-03-14
问题内容

我正在尝试通过使用搜索文本框来过滤ng-repeat中的嵌套对象。

给定以下对象:

$scope.items = {
    "1": {
        name: "First Item",
        tag: "first"
    },
    "2": {
        name: "Second Item",
        tag: "second"
    }
};

我想做这样的事情:

<input type="text" name="serchBox" ng-model="searchByName">
<p ng-repeat="(key, values) in items | filter:{name: searchByName}">
    Using both {{key}} and {{values.name}}
</p>

这确实是行不通的。我尝试了很多事情,但无法使其正常运行。 我不想更改我的对象。 我进行了很多搜索,但没有找到符合我需要的内容。


问题答案:

我终于有了自己的问题的答案。

我只需要创建自己的过滤器,并使用正则表达式检查对象内部的属性是否具有所需的值即可:

app.filter('customSearchFilter', function() {
return function(input, term) {
    var regex = new RegExp(term || '', 'i');
    var obj = {};
    angular.forEach(input, function(v, i){
      if(regex.test(v.name + '')){
        obj[i]=v;
      }
    });
    return obj;
  };
});

并以这种方式在HTML中应用它:

<input type="text" ng-model="searchName" />
<ul>      
  <li ng-repeat="(key, val) in items | customSearchFilter:searchName">Both {{key}} and {{val.name}}</li>
</ul>

我创建了这个Plunker来展示我的解决方案



 类似资料:
  • 问题内容: 我有许多产品要重复使用ng-repeat,并且正在使用 按颜色过滤这些产品。过滤器正在运行,但是如果产品名称/说明等包含颜色,则在应用过滤器后该产品仍然存在。 如何将滤镜设置为仅应用于数组的颜色字段而不是每个字段? 问题答案: 请参阅过滤器页面上的示例。使用一个对象,并在color属性中设置颜色:

  • 问题内容: 我有一些虚拟XML文件: 使用此库http://code.google.com/p/x2js/将其转换为json,并转换为变量 Day可以具有任意数量的Job,Job可以嵌套并且包含任意数量的其他Job。 现在使用此代码 我可以列出有效的日期。我希望使用以下代码 我可以列出当天的工作日和最高职位,但这是行不通的。(要列出嵌套的Jobs,将是下一个任务,而不是现在询问该任务)。 那么,如

  • 问题内容: 我在ng-table中有一张发票清单,希望能够对嵌套属性进行过滤。json看起来像这样; 我的看法是这样的 我想让过滤工作于client.fullname。如何过滤嵌套属性? 更新资料 我找到了一种解决方法,将嵌套字段放入非嵌套的JSON元素中,在上面的示例中,我创建了一个JSON [‘client_name’]元素并将其分配给rails模型中的client.fullname。然后,筛

  • 问题内容: 我有一个JSON对象,表示为: 我需要在 第二 层上做一个中继器,列出“虚假”数字。 我已经知道如何获得最高水平 但是我不清楚循环降级的顺序。例如,这是错误的: 我也知道如何 嵌套 中继器来实现这一点,但是在这种情况下,我根本不需要显示顶层。 澄清说明 这里的目标是有一个带有4个“伪”数字的列表(每个包裹有2个,顺序中有2个包裹)。 问题答案: 大量搜索不错的简单解决方案以进行动态迭代

  • 我在一个网站上使用angularjs,那里有一个搜索输入,可以过滤视图上的列表。此列表显示为一个ng-repeat,该ng-repeat具有搜索输入中的筛选器: 搜索输入:

  • 问题内容: 我具有Room对象的以下结构。 其中,消息是具有以下结构的对象的嵌套数组 我想通过房间集合中的消息执行搜索查询。我尝试使用,但没有帮助我。 而且,我必须通过匹配值来搜索元素。我可以使用bson正则表达式来做到这一点。 总结我需要按“房间”文档中嵌套对象中的字段搜索消息。 PS对不起,可能会出现错误,英语不是我的母语。 更新 基本上,我想在给定的房间中找到包含某些子字符串的所有消息。例如