Question

我目前正在研究AngularJS技术，我有一个问题。

我创建了一个HTML（从我正在研究这项技术的CodeProject网站上复制），它基本上显示了一本书的细节（ISBN，价格等）。您可以参考下面的代码段：

<tr ng-repeat="item in items">
                            <td>{{item.ISBN}}</td>
                            <td>
                                <span ng-hide="editMode">{{item.Name}}</span>
                                <input type="text" ng-show="editMode" ng-model="item.Name" />
                            </td>
                            <td>
                                <span ng-hide="editMode">{{item.Price}}</span>
                                <input type="number" ng-show="editMode" ng-model="item.Price" />
                            </td>
                            <td>
                                <span ng-hide="editMode">{{item.Quantity}}</span>
                                <input type="number" ng-show="editMode" ng-model="item.Quantity" />
                            </td>
                            <td>{{(item.Quantity) * (item.Price)}}</td>
                            <td>
                                <span><button type="submit" ng-hide="editMode" ng-click="editMode = true;editItem(item)">Edit</button></span>
                                <span><button type="submit" ng-show="editMode" ng-click="editMode = false">Save</button></span>
                                <span><input type="button" value="Delete" ng-click="removeItem($index)"/></span>
                            </td>
                        </tr>

控制器名称是Bookstore，下面是代码段：

app.controller("Bookstore", function($scope)
{
    $scope.items = [
        { ISBN: "5674789", Name: "ASP.NET MVC", Price: 560, Quantity: 20 },
        { ISBN: "4352134", Name: "AngularJS", Price: 450, Quantity: 25 },
        { ISBN: "2460932", Name: "Javascript", Price: 180, Quantity: 15 }
    ];
}

$scope.removeItem = function (index) {
        $scope.items.splice(index, 1);
    }

问 1.我特别困惑的是html中的 $ index 参数。这是AngularJS的内置属性，它返回它所在的索引吗？我问这个的原因是因为它从未在.js文件中初始化，所以我很困惑计算机如何理解$ index是所选项目的位置。

对不起，如果我的问题看起来有点令人困惑。

Answer 1

是的，$index是ng-repeat的内置参数。 angularJS的ng-repeat指令自动知道它正在迭代的数组的索引。

你可以通过将它与forEach循环进行比较来更好地理解它。index循环知道ng-repeat在迭代数组时的值。

有关进一步说明，您可以在此处查看文档： https://docs.angularjs.org/api/ng/directive/ngRepeat

你也可以在这里阅读这篇精彩的博文，以便更好地理解它： http://liamkaufman.com/blog/2013/05/13/understanding-angularjs-directives-part1-ng-repeat-and-compile/

Answer 2

$index为每个项目创建子范围。

在该子范围内，它会在内部创建reverse . map reverse . inits . reverse等属性

有关这些范围属性的完整列表，请参阅ng-repeat docs

顶部的表格

Answer 3

$ index 变量由angular的ng-repeat指令动态创建。它类似于数组用于存储某些数据的索引。

更多相关信息：https://docs.angularjs.org/api/ng/directive/ngRepeat

AngularJS的基本问题

3 个答案: