使用directive / angular找出几个索引

Question

我写了一个指令，为kicker游戏提供了一些可点击的div，看起来是这样的：

<span>Team 1</span>
<scoreDisplay>
    <div ng-click="setScore(0)" class="score-item">1</div>
    <div ng-click="setScore(1)" class="score-item">2</div>
    <div ng-click="setScore(2)" class="score-item">3</div>
    <div ng-click="setScore(3)" class="score-item">4</div>
    <div ng-click="setScore(4)" class="score-item">5</div>
    <div ng-click="setScore(5)" class="score-item">6</div>
</scoreDisplay>

<span>Team 2</span>
<scoreDisplay>
    <div ng-click="setScore(0)" class="score-item">1</div>
    <div ng-click="setScore(1)" class="score-item">2</div>
    <div ng-click="setScore(2)" class="score-item">3</div>
    <div ng-click="setScore(3)" class="score-item">4</div>
    <div ng-click="setScore(4)" class="score-item">5</div>
    <div ng-click="setScore(5)" class="score-item">6</div>
</scoreDisplay>

单击一个分值项后，我想要获得指令的索引，其中的项，这里是控制器中的score函数：

$scope.game = {
    team_1:{name:'Ateam',score:0}
    team_2:{name:'Bteam',score:0}
};
$scope.setScore = function(itemindex, directiveindex){
    $scope.game["team_"+(directiveindex+1)].score = (itemindex+1)

}

你知道怎么用angular得到指令索引(父elemment dom索引)吗？谢谢你的帮助。

Answer 1

对代码部分使用ng-repeat指令，如：

    <div ng-click="setScore(0)" class="score-item">1</div>
    <div ng-click="setScore(1)" class="score-item">2</div>
    <div ng-click="setScore(2)" class="score-item">3</div>
    <div ng-click="setScore(3)" class="score-item">4</div>
    <div ng-click="setScore(4)" class="score-item">5</div>
    <div ng-click="setScore(5)" class="score-item">6</div>

您可以在控制器中替换：

$scpe.teams = [...]

在模板中：

<div ng-repeat="team in teams" ng-click="setScore(team.score,$index)" class="score-item">{{team.name}}</div>

您可以对scoreDisplay进行类似的更改

Answer 2

找到一个属性为“index”的解决方案：

<scoreDisplay index="1"></scoreDisplay>
<scoreDisplay index="2"></scoreDisplay>

这可以很好地工作，但我会寻找一个更好的解决方案，比如：

angular.element("body scoreDisplay").index($event.target);