在Angular中的过滤器上隐藏组

Question

我的REST API正在返回分组数据，

{
  "Homer Simpson": [
    {
      "name": "First article",
      "type": "text"
    },
    {
      "name": "Second article",
      "type": "text"
    }
  ],
  "Marge Simpson": [
    {
      "name": "Third article"
      "type": "text
    }
  ]
}

文章可以过滤：

<input type="text" placeholder="Quicksearch" ng-model="quicksearch">
...
<div class="article-group" ng-repeat="(author, articles) in articles">
  <h3>{{author}} ({{filtered.length}})</h3>
  <div class="article" ng-repeat="article in articles | filter: { name: quicksearch } as filtered">

这里重要的是({{filtered.length}}) 。 通过在quicksearch输入中键入内容来应用过滤器后，长度会发生变化。 一切都很好，但我想隐藏“空”的作者; 如果你输入“第三”，你就不应再看到荷马辛普森了。

在article-group div上尝试了ng-if="filtered.length > 0" ，但这不起作用。

Answer 1

你可以简单地把ng-show="filtered.length"放在.article-group容器上：

<div class="article-group" ng-show="filtered.length" ng-repeat="(author, articles) in articles">
  <h3>{{author}} ({{filtered.length}})</h3>
  <div class="article" ng-repeat="article in articles | filter: { name: quicksearch } as filtered">
    <pre>{{ article | json }}</pre>
  </div>
</div>