首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >Anuglar js过滤深度对象

Anuglar js过滤深度对象
EN

Stack Overflow用户
提问于 2018-06-02 02:00:52
回答 1查看 56关注 0票数 0

我陷入了一种必须使用filter in ng-repeat查找数据的情况

情况:

Data是对象的数组名称为,状态为,状态具有a属性

现在,我想过滤具有属性状态的对象。a as started and in progress

我尝试过多种解决方案

Sol1

代码语言:javascript
复制
ng-repeat="item in items | filter: {status :{a:'Not Started'},status: {a:'In Progress'}}

仅返回正在进行中的的结果:状态.a

Sol2:

代码语言:javascript
复制
<p ng-repeat="item in items | filter: {status :{a:'Not Started' , a:'In Progress'}}">
    {{ item.name }}
</p>

返回相同的结果:status.a of In Progress only

html

代码语言:javascript
复制
<div ng-controller="mainCtrl">
    <h1>List 1</h1>
    <ul>
            <li class="clearfix">
              <label>
                 <input ng-model="tracks.ns"
                        ng-true-value="'Not Started'"
                        ng-false-value="''" 
                        type="checkbox">
                 Not started 
              </label>
            </li>
            <li class="clearfix">
              <label> <input ng-model="tracks.ip" ng-true-value="'In Progress'" ng-false-value="''" type="checkbox">In-progress </label>
            </li>
            <li class="clearfix">
              <label> <input ng-model="tracks.do" ng-true-value="'Done'" ng-false-value="''" type="checkbox">Done </label>
            </li>
    </ul>
    {{tracks.ns}}
    <p ng-repeat="item in filteredItems">{{ item.name }}</p>
    <h1>List 2</h1>
    <p ng-repeat="item in items | filter: {status :{a:'Not Started' , a:'In Progress'}}">{{ item.name }}</p>
</div>

js

代码语言:javascript
复制
    $scope.items = [{
    name: "Alvi",
    status: {
        a: 'Not Started'
    }
}, {
    name: "Krane",
    status: {
        a: 'Done'
    }
}, {
    name: "Tate",
    status: {
        a: 'In Progress'
    }
}, {
    name: "Lorus",
    status: {
        a: 'In Progress'
    }
}];
    $scope.tracks = {ns: '',ip: '',done : ''}

问题:

  1. 没有自定义筛选器我能达到预期效果吗?
  2. 如果可以,比没有自定义筛选器如何?

plunker:http://plnkr.co/edit/njsoPu1LHLmNmEx6lCew?p=preview

EN

回答 1

Stack Overflow用户

发布于 2018-06-02 05:44:53

在过滤器表达式中使用函数:

代码语言:javascript
复制
<p ng-repeat="item in items | filter : customFn">
            {{ item.name }} {{ item.status }}
</p>

JS

代码语言:javascript
复制
$scope.customFn = function(value, index, array) {
    console.log(value, index, array);
    if (!value) return true;
    if (value.status.a == 'Not Started') return true;
    if (value.status.a == 'In Progress') return true;
    //else
    return false;
}    

有关更多信息,请参阅AngularJS Filter Component Reference - filter

The DEMO on PLNKR

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/50648814

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档