Question

我有一个类别列表 - 在这些类别中，有项目：

Category 1:
   Item 1
   Item 2
   Item 3

Category 2:
   Item 1
   Item 2
   Item 3

 Category 3:
   Item 1
   Item 2
   Item 3

我遍历其中的类别和项目。默认情况下，我不希望显示的项目。用户必须单击类别才能显示项目。我遇到的问题是，当用户点击任何类别时，它正在扩展所有类别中的项目。

<div>
  <ul data-ng-repeat="category in categories">
    <li data-ng-click="ExpandCategory()">{{category.name}}</li>
      <ul data-ng-show="showItems == true" data-ng-repeat="item in category.items">
        <li>{{item.name}}</li>
      </ul>         
   </ul>                        
 </div>

如何将其限制为点击的类别？

$scope.ExpandCategory = function (){
   $scope.showItems = true;
}

Answer 1

尝试一下：

<li data-ng-click="ExpandCategory($index)"> ...
    <ul data-ng-show="showItems[$index]" ...

然后：

$scope.ExpandCategory = function(index) {
    $scope.showItems[index] = true;
}

我可能没有正确的语法，但你明白了。

根据点击显示DOM元素

1 个答案: