ng-repeat 按前一个 ng-repeat 的对象过滤答案

【问题标题】：ng-repeat filtered by object of previous ng-repeatng-repeat 按前一个 ng-repeat 的对象过滤
【发布时间】：2017-04-21 12:28:59
【问题描述】：

我有这个结构，但我不知道如何使用之前 ng-repeat 迭代的对象过滤 ng-repeat 内容。

//############################################ ###############################//

我的模型：

var app = angular.module('myApp', [angular.filter]);

app.controller('controller', function($scope){

$scope.dashboards =[{"name":"Dashboard 1","category":"C1","subcategory":"SC1"},
                    {"name":"Dashboard 2","category":"C1","subcategory":"SC2"},
                    {"name":"Dashboard 3","category":"C2","subcategory":"SC1"},
                    {"name":"Dashboard 4","category":"C2","subcategory":"SC2"},
                    {"name":"Dashboard 5","category":"C2","subcategory":"SC3"}];
});

//############################################ ###############################//

我的html：

<div ng-app="myApp">
<div ng-controller="controller">

<div ng-repeat="dashboard in dashboards | unique: 'category'"><!--Level 1-->
   <h2>{{dashboard.category}}</h2>
   <div ng-repeat="dashboard in dashboards | filter: { category: {{dashboard.category}} } | unique: 'subcategory'"><!--Level 2-->
      </h3>{{dashboard.subcategory}}</h3>
      <div ng-repeat="dashboard in dashboards | filter: { subcategory: {{dashboard.subcategory}} }"><!--Level 3-->
         <p>{{dashboard.name}}</p>
      </div>
   </div>
</div>

</div>
</div>

我的问题是不知道如何使用lower level的内容来过滤ng-repeat。

例如，我尝试使用表达式过滤级别 2 和级别 1 的类别，并使用其他表达式过滤级别 2 的子类别的级别 3

*在第 1 级和第 2 级中，我使用了一个过滤器，它返回我模型的唯一值

【问题讨论】：

我认为您需要更好地解释您要做什么。您当然可以使用更高范围的变量，但我不清楚您想要什么。
我编辑问题以便更好地解释

标签： angularjs angularjs-directive angularjs-ng-repeat

【解决方案1】：

HTML 存在一些相当简单的问题。

首先，ng-repeat 中不允许使用表达式 ({{ }})；解析器将在没有表达式语法的情况下找出属性。

<div ng-repeat="dashboard in dashboards | unique: 'category'">
  <!--Level 1-->
  <h2>{{dashboard.category}}</h2>
  <div ng-repeat="dashboard in dashboards | filter: { category: dashboard.category } | unique: 'subcategory'">
    <!--Level 2-->
    <h3>{{dashboard.subcategory}}</h3>
    <div ng-repeat="dashboard in dashboards | filter: { subcategory: dashboard.subcategory }">
      <!--Level 3-->
      <p>{{dashboard.name}}</p>
    </div>
  </div>

http://plnkr.co/edit/dniUyHdIWGFOWYJyKjjf?p=preview

然而，这并不是故事的全部。级别 3 div 需要由category 和subcategory过滤。

<div ng-repeat="dashboard in dashboards | unique: 'category'">
  <!--Level 1-->
  <h2>{{dashboard.category}}</h2>
  <div ng-repeat="dashboard in dashboards | filter: { category: dashboard.category } | unique: 'subcategory'">
    <!--Level 2-->
    <h3>{{dashboard.subcategory}}</h3>
    <div ng-repeat="dashboard in dashboards | filter: { category: dashboard.category, subcategory: dashboard.subcategory }">
      <!--Level 3-->
      <p>{{dashboard.name}}</p>
    </div>
  </div>
</div>

http://plnkr.co/edit/6ClArqDH3OiQ7ECT95YD?p=preview

【讨论】：

非常感谢您的帮助