Question

我正在使用ng-repeat创建一组表单，每个表单都有一个复选框（如果重要的话可能会更改为无线电）并且我正在尝试操作检查的特定级别。所以我要做的是传递复选框的索引（ng-repeat中的索引。让我告诉你我的意思

<div class="saInstrcutionTableRow"  ng-repeat="parent in listTable track by $index">
                        <div class="saInstrcutionLeft"></div>
                        <!-- parent levels -->
                        <div  class="saInstrcutionCRight saInstrcutionTitle"><div class="parentSub1"> <input type="checkbox" ng-model="levelPicker">{{parent.name}}</div></div>

                        </div>

                    </div>

所以我在这里只是用ng-model =＆＃34; levelPicker＆＃34;下的输入重复名称。我在这个外面按了一个按钮，它使用了我设置的功能，只需要在重复内传递复选框的索引，所以就像这样 -

<button type="button" class="resultsButton" ng-click="submitNewSub(Checkbox index here)">Submit</button>

是否有一些角度来定位已选中的复选框并在重复中获取其索引？我正在使用它来添加孩子。我尝试了一些事情，但我不确定如何直接引用它并获得它的索引（在角度内）。任何输入都将非常感激。谢谢！

Answer 1

您可以使用类似这样的内容捕获所选索引

<input type="checkbox" ng-change="onChange({{$index}})" ... />

onChange功能

  $rootScope.onChange = function(idx) {
    $rootScope.selectedIndex = idx;
  };

然后根据您的需要使用selectedIndex。这是一个quick example

Answer 2

ng-repeat为每个项目创建一个新范围，因此父母无法直接访问“＆＃;”levelPicker＆＃39;由任何一个复选框设置。

最正确的方法可能是这样的：

$scope.listTable = [
    { name : 'a', selected: false },
    { name : 'b', selected: false },
    { name : 'c', selected: false }
];
$scope.selectMe = function ( index, previousValue ) {
    $scope.listTable[index].selected = !previousValue;
};
$scope.submitNewSub = function () {
    for ( var i=0; i<$scope.listTable.length; i++ ) {
        console.log($scope.listTable[i].name+
            ($scope.listTable[i].selected ?
                ' is selected' :
                ' is not selected')
        );
    }
}

在html中使用这个：

<input type="checkbox" ng-click="selectMe($index, levelPicker)" ng-model="levelPicker">{{parent.name}}

或者您可以查看所有子范围并检查其levelPicker值：

$scope.submitNewSub = function () {
    for(var cs = $scope.$$childHead; cs; cs = cs.$$nextSibling) {
        console.log($scope.listTable[cs.$index].name+
            (cs.levelPicker ?
                ' is selected' :
                ' is not selected')
        );
    }
};

Angular，在ng-repeat中获取已选中复选框（或无线电）的索引

2 个答案: