角度 ng-repeat 元素。在视图更改上重置拨动开关答案

【问题标题】：Angular ng-repeat element. Reset toggle-switch on view-change角度 ng-repeat 元素。在视图更改上重置拨动开关
【发布时间】：2017-12-14 02:23:23
【问题描述】：

我有一个由迭代对象数组的 ng-repeat 生成的列表。对于创建的每个元素，我都有一个切换 showDetails-body 的 ng-click。像这样：

<li class="list-group-item" ng-repeat-start="order in orderList " 
     ng-click="order.showDetails = !order.showDetails"

当我更改整个窗口的状态（即更改视图）时，如何将该特定元素切换为 false？问题是当我在应用程序中更改视图时，会显示带有详细信息的列表元素“正文”。我需要重置该特定元素。可能吗？

【问题讨论】：

我想你可以打电话给$scope.orderList[yourIndex].showDetails = false
我不知道索引。可能会扩展许多列表元素。当我更改内容时，它们会粘在页面上。
然后只需遍历整个列表并将他们的每个showDetails 设置为false
试试 ng-click="orderList[$index] .showDetails = !orderList[$index] .showDetails"
为什么不能像@BunyaminCoskuner 建议的那样简单地遍历所有订单？在你的控制器中尝试angular.forEach($scope.orderList, function(order){ order.showDetails = false; }); 之类的东西。

标签： html angularjs angularjs-ng-repeat html-lists

【解决方案1】：

 $scope.collapseListItem = function(){
        $scope.orderList.forEach(function(element) {
            element.showDetails=false;
        });
    }

这解决了我的问题。更改视图时，我在视图中使用 ng-click() 调用此函数。

【讨论】：

【解决方案2】：

使用 ng-repeat 代替 ng-repeat-start

<body ng-controller="MainCtrl">
 <li class="list-group-item" ng-repeat="order in orderList " 
  ng-click="order.showDetails = !order.showDetails">{{order.name}}
  {{order.showDetails}}</li>
</body>

让管家

app.controller('MainCtrl', function($scope) {
      $scope.orderList = [{"name":"John","showDetails":false},
           {"name":"Doe","showDetails":false}
      ];
});

打工仔https://plnkr.co/edit/Yc5zU7VRP41qWQfP0IsC?p=preview

【讨论】：