ng-repeat中的AngularJS不同大小和值选择框

Question

我知道问题出在哪里，但到目前为止我解决问题的尝试没有成功。任何帮助表示赞赏。

我正在 ng-repeat 循环中从 JSON 数据创建一个表。表格列之一代表选择框，它们具有不同的值和大小。此 select 语句位于 ng-repeat 块内。

               <tr ng-repeat="unit in unitsData">
                    <td>{{unit.unitName}}</td>
                    <td>{{unit.unitType}}</td>
                    <td>
                        <select class="form-control" ng-model="unit.unit" ng-options="option.value as option.name  for option in getUnitListForUnitType(unit.unitType)"></select>
                    </td>
               </tr>

我收到此错误：[$rootScope:infdig] 10 $digest() 迭代次数已达到。中止！

基于选择框的 Angular 文档，问题来自 getUnitListForUnitType 函数，我在控制器中创建该函数以根据提供的参数返回不同的列表。不确定如何更正此代码。

Answer 1

问题是 ng-repeat 会为每个项目重新评估，然后它本身会再次调用摘要循环，这就是您遇到的错误。

而不是调用：

getUnitListForUnitType(unit.unitType)

你需要有一个 $scope 变量，例如：

... ng-repeat ... option in unitList[unit.unitType]

您有一个名为 $scope.unitList 的 $scope 变量，它是一个列表列表。当您设置您的类时，只需将该列表列表初始化为一个变量，这应该是诀窍。

$scope.unitList = {
    unit1 : ['item1', 'item2'],
    unit2 : ['item3', 'item4']
};