Angular JS：一次僅切換一個項目

Question

因此，我有一個要進行ng-repeat的名稱列表，並且我對每個名稱都進行了ng-click該名稱可以顯示工具提示。 我這樣做是這樣的：

<li ng-repeat="person in names" ng-click="tooltip = !tooltip">
  <span>{{ person }}</span>
  <div class="tooltip" ng-show="tooltip">This is {{ person }}'s tooltip</div>
</li>

單擊人員1的名稱時，將顯示其工具提示，但單擊人員2時，也將顯示其工具提示。 我只希望一次顯示一個工具提示。 使用上面的切換技術tooltip = !tooltip是否可以？

我已經在這里設置了我的問題的JS Bin： https : //jsbin.com/faxoviwuze/1/edit?html ,js, output

任何幫助表示贊賞。

提前致謝！

Answer 1

使用$index ：

<ul ng-init="model.tooltip=-1">
<li ng-repeat="person in names" ng-click="model.tooltip = $index">
  <span>{{ person }}</span>
  <div class="tooltip" ng-show="model.tooltip==$index">This is {{ person }}'s tooltip</div>
</li>
</ul>

我建議不要使用諸如tooltip類的標量范圍變量。
解除綁定很容易。 使用諸如model.tooltip類的model.tooltip 。

簡單的小提琴

---

另外，沒有理由注入$scope scope-您可以使用controllerAs語法。

JSBin