Question

我正在尝试实现如下图所示的内容。这是我的数据

$scope.Reports = 
[
{ Id: 1, Name: 'Report One', Year: 2016, Month: 5 },
{ Id: 2, Name: 'Report Core', Year: 2016, Month: 5 },
{ Id: 3, Name: 'Report Alpha', Year: 2016, Month: 3 },
{ Id: 4, Name: 'Report Moon', Year: 2015, Month: 5 },
{ Id: 5, Name: 'Report Sky', Year: 2015, Month: 2 }
];

目标是，如果您点击任何数字，则下划线表示属于该月份的报告隐藏或显示（可折叠）。我尝试了很多东西，但似乎我无法弄清楚我需要什么。我已经制作了一个我的代码所在的JS BIN。

http://jsbin.com/huhabehoju/edit?html,js,output

任何帮助都会很感激。感谢

<body>
<div ng-controller="MainController"> 
<ul ng-repeat="(key, value) in Reports | groupBy: 'Year'">
{{ key }}
<ul ng-repeat="(key1, value1) in value | groupBy: 'Month'">
O{{key1}} 
<li ng-repeat="p in value1">
{{p.Name }} 
</li>
</ul>
</ul>
</div>
</body>

Answer 1

这是有效的

    $scope.showReport = {};
      $scope.toggleShow = function (ym) {

       $scope.showReport[ym] = !$scope.showReport[ym];
     };
 });

在控制器中和html这个

    <ul ng-repeat="(key, value) in Reports | groupBy: 'Year'">
      {{ key }}
      <ul ng-repeat="(key1, value1) in value | groupBy: 'Month'">
    <a ng-click="toggleShow(key+key1)"> O{{key1}} </a>
  <li ng-repeat="p in value1" ng-if="!showReport[key+key1]">
    {{p.Name }} 
  </li>
</ul>
</ul>

折叠使用角度js ng-repeat和过滤器创建的div

1 个答案: