angularjs - 如何计算对象键以确定表达式？

Question

如果表为空，我试图隐藏表的父元素(包含使用 ng-repeat 创建的行)。我找到了以下示例:

https://stackoverflow.com/a/14616397/930998

但这仅适用于数组。我有一个带有这样的嵌套对象的对象:

{
  "-J9dKgyHpCTNNImuydo6" : {
    "url" : "http://www.example.se",
    "title" : "Example 1",
    "uuid" : "-J9dKgyHpCTNNImuydo6",
    "sla" : false
  },
  "-J9dKQ2kxHzFc5-bJIKN" : {
    "url" : "http://www.example.com",
    "title" : "Example 2",
    "uuid" : "-J9dKQ2kxHzFc5-bJIKN",
    "sla" : true
  }
}

我的中继器看起来像这样:

  <tr ng-repeat="site in sites | archived:false">
    <td class="title">{{site.title}}</td>
    <td class="url"><a href="{{site.url}}" target="_blank">{{site.url}}</a></td>
    <td class="sla">{{site.sla | BooleanToText}}</td>
  </tr>

正如你所看到的，我的中继器上也有一个过滤器。我想要做的是如果“站点中的站点 | archived:false”为空，则隐藏整个表。我尝试过以下方法:

ng-show="(sites | archived:false).length"

和

ng-show="(Object.keys(sites) | archived:false).length"

但我无法正确理解。我认为无论我做什么，长度总是返回 0。

这里有一个 fiddle 可以让它更明显: http://jsfiddle.net/insats/djD4m/3/如果表格为空，我基本上想隐藏包装 div。

Answer 1

也许有一个更简单的解决方案，但肯定会起作用:

添加一个方法来指示过滤后的集合是否为空:

$scope.isNonArchivedSiteCollectionEmpty = function () {
... // you can use filter here or some simpler logic to determine if there is
... // at least one element in the collection
}

然后在您看来只需使用:

ng-hide="isNonArchivedSiteCollectionEmpty()"

更新 可能最合理的方法是保留并刷新 $scope 中的过滤器集合，并完全放弃在标记中使用过滤器。然后你可以很容易地检查它是否为空。