Question

我在ng重复中有一些数据，在里面我有一些数据在崩溃的每个div下面。

当我点击主要div时，我只希望一次只有一个div崩溃。

例如：如果我点击 abc ，则应显示 asdasd ..如果我点击 abc1 ， asdasd1 应该显示，但 NOT asdasd

<script>
angular.module('myApp', [])
.controller("Ctrl_List", ["$scope", function(s) {
   s.people = [
{name:"Sten", age:"49"}
,{name:"John", age:"39"}
,{name:"Hanne", age:"37"}
,{name:"Jens", age:"37"}
,{name:"Brian", age:"24"}
,{name:"Johnny", age:"24"}
,{name:"Peter", age:"49"}
]
s.obj = [
              {
                "name":'abc',
                "text":'asdasd'
              },
              {
                "name":'abc1',
                "text":'asdasd1'
              }
              ]
}])

HTML：

<body ng-app="myApp" ng-controller="Ctrl_List">

<div ng-repeat="ob in obj">
    <button class="btn" data-toggle="collapse" href="#abc-{{ob.name}}"> {{ob.name}}</button>
    <div id="abc-{{ob.name}}" class="collapse">{{ob.text}}</div>
   </div>
</body>

数据父级对我不起作用，或者我可能没有正确使用它。

请检查小提琴here

Answer 1

使用纯Angular方法而不是使用JQuery。

向每个对象添加一个新属性Pentaho Kettle Solutions: Building Open Source ETL Solutions with Pentaho Data Integration，并使用show使用控制器中的方法显示/隐藏其对应的文本。

ng-if

控制器方法

<div ng-repeat="ob in obj">
   <button class="btn" ng-click=" showThis(ob)"> {{ob.name}}</button>
   <div ng-if="ob.show">{{ob.text}}</div>
</div>

Working Fiddle

在ng-repeat中只允许一个折叠div

1 个答案: