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>

正如您所看到的，我在转发器上也有一个过滤器。我想要做的是隐藏整个表，如果“site in sites | archived：false”为空。我尝试了以下内容：

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

和

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

但我无法做对。我认为无论我做什么，长度总是会返回0。

这是一个让它更加明显的小提琴：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中的过滤器集合，并使用标记中的过滤器完全退出。然后你可以很容易地检查它是否为空。

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

1 个答案: