Question

我有一个简单的ng-repeat-start和ng-repeat-end。在ng-repeat中，我有一个ng-click。如何在ng-click中使用ng-repeat-start中的$ index来显示/隐藏ng-show。

HTML：

<ul>
    <li ng-repeat="data in MyData track by $index">
        <p>Show me my {{ data }}</p>
    </li>
    <li>
        <div>
            <p>Select</p>
            <span ng-click="{{'showHidden'+$index = !'showHidden'+$index}}"></span>
        </div>
        <div>
            <p ng-show="{{'showHidden'+$index}}">My hidden content, my hidden content, my hidden content, my hidden content, my hidden content, my hidden content </p>
        </div>
    </li>
    <li ng-repeat-end>
        <p>{{ data.name }}</p>
        <p>{{ data.age}}</p>
    </li>
</ul>

基本上我拥有的是：

ng-click="{{'showHidden'+$index = !'showHidden'+$index}}"

ng-show="{{'showHidden'+$index}}"

其中$ index由父ng-repeat-start

确定

Answer 1

您可以初始化临时变量以跟踪可见性布尔值（我只是将其称为“可见”）。 ng-repeat的每个循环都有自己的$ scope，因此新变量被约束到$ scope。

http://jsfiddle.net/HB7LU/12783/

<div ng-controller="MyCtrl">
  <ul>
    <li ng-repeat-start="data in MyData track by $index" ng-init="visible = false">
        <p>Show me my {{ data }}</p>
    </li>
    <li>
        <div>
            <p>Select</p>
            <a href="" ng-click="visible = !visible">*</a>
        </div>
        <div>
            <p ng-show="visible">My hidden content, my hidden content, my hidden content, my hidden content, my hidden content, my hidden content </p>
        </div>
    </li>
    <li ng-repeat-end>
        <p>{{ data.name }}</p>
        <p>{{ data.age}}</p>
    </li>
</ul>
</div>

如何在ng-repeat-start / end中使用ng-click上的$ index

1 个答案: