如何计算ng-repeat创建的输入标签

Question

我正在开发一个具有大型调查表格的Angular应用程序。我正在创建一个状态栏，指示已完成表单的百分比。该表单包含9个直接写入html的输入字段，以及由于ng重复而发生的约50个字段。

我计划实施的一部分是计算页面上的输入标签数量。这样，如果应用程序的用户更改调查表单，代码仍将处理修改。我在调查控制器中编写了以下代码，用于存储页面上输入标签的数量：

$scope.numberOfInputFields = angular.element($document[0].querySelectorAll('input')).length;

我的问题是上面的代码返回直接写入html的输入字段数，但不计算ng-repeat写入的任何输入标记。

我相信上面写的代码是在ng-repeat渲染之前执行的，但我不知道如何继续。

Answer 1

根据doc

<input type="text" ng-repeat="i in [0,1,2,3,4,5]"  ng-value="$index" />

<input type="text" ng-repeat="i in [0,1,2,3,4,5]" ng-value="$last" />

只是：

$ index 重复元素的数字迭代器偏移量（0..length-1）

$ first 布尔值如果重复元素在迭代器中是第一个，则为true。

$ middle 布尔值如果重复元素位于迭代器中的第一个和最后一个之间，则为true。

$ last 布尔值如果重复元素在迭代器中是最后一个，则为true。

$ even 布尔值如果迭代器位置$ index为偶数，则为true（否则为false）。

$ odd 布尔值如果迭代器位置$ index为奇数，则为true（否则为false）。

Answer 2

似乎在执行计数语句时，ng-repeat尚未完成渲染。

您可以尝试通过$timeout服务推迟执行：

$timeout(function () {
  $scope.numberOfInputFields = angular.element($document[0].querySelectorAll('input')).length;
});

您可能需要更改使用$scope.numberOfInputFields的代码。

但是，如果您不知道直接计算DOM，就可以更好地了解输入计数。