根据子对象属性过滤 ng-repeat 列表答案

【问题标题】：Filtering an ng-repeat list based on a sub-object property根据子对象属性过滤 ng-repeat 列表
【发布时间】：2013-07-05 01:19:55
【问题描述】：

jsfiddle http://jsfiddle.net/KfSBq/

子对象是指我使用 ng-repeat 显示的对象都包含一个对象列表，我希望根据其中一个子对象的属性进行过滤。

仅此一项就很简单了。我有一个dailies 的对象，每个对象都包含一个date 和一个entries 对象列表：

function Ctrl($scope) {
    $scope.dailies = [{date: new Date('07/07/2013'), 
                       entries: [{category: 'A', note:'Lorem ipsum'}, 
                                 {category: 'B', note: 'Lorem ipsum'}]},
                      {date: new Date('05/02/2013'), 
                       entries: [{category: 'A', note: 'Lorem ipsum'}]}];
}

我显示它们，按类别过滤：

<div ng-controller="Ctrl">
        <div class="daily" ng-repeat="daily in dailies | orderBy:'-date' ">
            {{ daily.date | date:'dd/MM/y' }}
            <div class="entry" ng-repeat="entry in daily.entries | filter:{ category: 'B'} ">
                <span>{{ entry.category }}</span>, <span>{{ entry.note }}</span>
            </div>
        </div>
    </div>

我的问题是现在根本不包含条目的日常对象仍然显示。如果过滤使daily 的entries 列表为空，那么daily 也不会显示，我该如何实现？

【问题讨论】：

我认为你必须创建自己的过滤器

标签： angularjs angularjs-filter

【解决方案1】：

您可以在表达式中创建新的范围成员。

这使您可以将过滤列表分配给新变量，该变量可在整个本地范围内使用。这样，您可以将过滤列表的长度传递给 ng-show：

<body ng-app>
  <div ng-controller="Ctrl">
    <div class="daily" 
      ng-repeat="daily in dailies | orderBy:'-date' " 
      ng-show="filteredEntries.length"
    >
      {{ daily.date | date:'dd/MM/y' }}
      <div class="entry" 
        ng-repeat="entry in filteredEntries = (daily.entries | filter:{ category: 'B'})"
      >
        <span>{{ entry.category }}</span>, <span>{{ entry.note }}</span>
      </div>
    </div>
  </div>
</body>

FIDDLE

顺便说一句，很好地提出问题！

【讨论】：

哇，太棒了！虽然有点反直觉，但在 filterEntries 实际定义之前使用了 filteredEntries.length ，但我想这只是有角度的..
这很酷。有没有办法将filteredEntries保存到链上更高的范围变量中，或者例如在rootScope中？
非常优雅的解决方案，比我试图编写的复杂循环自定义过滤器更容易完成同样的事情。谢谢！
不幸的是，这个解决方案实际上并没有过滤每日任务列表，而只是隐藏了不需要的每日任务。这是一个很好的解决方法，但我个人正在寻找一个过滤列表，这样我就可以得到我过滤的“每日”计数。