0

シンプルな 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 から決定されます

4

1 に答える 1

0

一時変数を初期化して可視性ブール値を追跡できます (私はそれを「可視」と呼びました)。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>
于 2015-04-13T19:23:34.823 に答える