javascript - 如何正确使用 ng-init 和 ng-class

Question

我有一排按钮，想要将第一个按钮初始化为事件按钮(因为与其关联的数据已加载到我的 Controller 的初始化函数中)。下面的 HTML 效果很好，但是当我单击其他两个按钮时，“事件”类仍保留在第一个按钮上。我希望此按钮在页面加载时设置为事件状态，然后“正常”处理(即:如果单击不同的按钮，则从第一个按钮中删除事件类):

<div class="btn-group btn-group-sm">
  <button class="btn btn-default" ng-class="{active : isActive}" ng-init="isActive = true" type="button" ng-click="playerMap.clusterToggle(true)">Clustered</button>
  <button class="btn btn-default" type="button" ng-click="playerMap.clusterToggle(false)">Unclustered</button>
  <button class="btn btn-default" type="button" id="heatmap" ng-click="playerMap.heatmap()">Heatmap</button>
</div>

Answer 1

应该很简单:

如果您使用的是循环，那么它甚至很干净 - 只需传递索引即可。

<button class="btn btn-default" ng-class="isActive[0] ? 'active' : ''" ng-init="isActive[0]=true"  type="button" ng-click="toggleButton(isActive,0)">Clustered</button>
<button class="btn btn-default" ng-class="isActive[1] ? 'active' : ''"  type="button" ng-click="toggleButton(isActive,1)">Unclustered</button>
<button class="btn btn-default" ng-class="isActive[2] ? 'active' : ''"  type="button"  ng-click="toggleButton(isActive,2)">Heatmap</button>