Question

假设，我有：

$scope.head1="abc";
$scope.head2="bfc";
...
...
$scope.head12="bfc";

并且，我这样做：

<div ng-repeat="count in [3,4,5,6,7,8,9,10,11,12]" class="padding-top-10">
  <span>{{head + count}}</span>
</div>

我想在div中获取head1，head2，head3 .. head12的值。怎么做？

Answer 1

你有什么理由不这样做吗？

$scope.head = ["abc", "bfc", ..., "bfc"];

查看：

<div ng-repeat="count in [3,4,5,6,7,8,9,10,11,12]" class="padding-top-10">
  <span>{{ head[count - 1] }}</span>
</div>

如果这不是一个选项，您可以定义此方法：

$scope.getHead = function (num) {
    return $scope["head" + num];
};

然后：

<div ng-repeat="count in [3,4,5,6,7,8,9,10,11,12]" class="padding-top-10">
  <span>{{ getHead(count) }}</span>
</div>

Answer 2

你可以这样做

<div ng-repeat="count in [1,2,3,4,5,6,7,8,9]" class="padding-top-10">
       <span>{{$parent['head'+count]}}</span>
   </div>
</body>

像这样，您不需要额外的范围函数来获取范围变量中的值。 $ parent是必要的，因为你的ng-repeat创建了自己的范围。

angular docs - ＆gt; ngRepeat - 模块ng中的指令 ngRepeat指令为集合中的每个项目实例化一次模板。每个模板实例都有自己的范围，

Answer 3

将property accessor bracket notation与this关键字关键字一起使用：

<div ng-repeat="count in [3,4,5,6,7,8,9,10,11,12]" class="padding-top-10">
  <span>{{this["head"+count]}}</span>
</div>

使用Angular Expressions this关键字求值为表达式的$ scope。

请注意ng-repeat指令创建子范围，this表达式通过原型继承查找值。在this指令中使用ng-model时，这可能会导致问题。（通过遵循always have a '.' in your ng-models）

的“最佳实践”，可以很容易地避免使用原语这个问题