在AngularJs表达式

Question

我有一个ng-repeat div，我需要使用$index变量来构建表达式。请考虑以下事项：

<div ng-repeat="item in myItems track by $index">
   This will throw an error: {{myItemId_{{$index}}.someProperty}}
</div>

如果我有一个名为“myItemId_0”的$scope变量，如何在花括号{{}}表达式中使用$ index？我已经尝试省略$ index变量的花括号，但这不起作用：

{{myItemId_ $ index.someProperty}}

Answer 1

由于它是作用域的变量，因此创建一个通过括号表示法检索属性的函数。

HTML：

{{getByIndex($index, "someProperty")}}

控制器：

$scope.getByIndex = function(index, someProperty) {
    var propertyName = "myItemId_" + index;

    return $scope[propertyName][someProperty];
}

但是，逻辑解决方案是完全不以这种方式访问​​您的属性，而是使用已经从ng-repeat中获得的项目。

HTML：

div ng-repeat="item in betterItems track by $index">
    {{item.someProperty}}
</div>

控制器：

$scope.betterItems = [];
angular.forEach(myItems, function (i) {
    $scope.betterItems.push(createMappedItem(i));
}

即使您必须将集合映射到新集合（如果需要也可以重复使用），您仍然可以访问该原始项目。它更清洁，更容易维护。此外，如果您开始改变集合，则按索引检索可能非常危险。