角度jsで複数の行を選択

Question

多くの行を持つ角度jsのリストを持っています。リスト内の複数の行を選択して別の表に追加したいとしました。

私のコードがある

<li class = "list-group-item listroleitem" ng-repeat='role in roles' ng-click="selectRow(role) 
      " ng-class="{selectedRole: role === idSelectedRow}">{{role.roleName}}</li> 

コントローラー：

$scope.selectRow = function(name){ 
     $scope.idSelectedRow = name; 

    }; 

はどのようにそれを行うには？

Answer 1

選択した行の変数を制御するので、配列として初期化してみませんか？

$scope.idSelectedRow = []; 

$scope.selectRow = function(name){ 
    if($scope.idSelectedRow.indexOf(name) > -1) 
     $scope.idSelectedRow.splice($scope.idSelectedRow.indexOf(name), 1); 
    else 
     $scope.idSelectedRow.push(name); 

}; 

そしてCSSでこれを使用します。

<li class = "list-group-item listroleitem" ng-repeat='role in roles' ng-click="selectRow(role) 
      " ng-class="{selectedRole: isSelected(role) }">{{role.roleName}}</li> 




$scope.isSelected = function(some_role){ 
      return $scope.idSelectedRow.indexOf(role) >-1; 
} 

Answer 2

は、どのように私は選択を解除う

<li class = "list-group-item listroleitem" ng-repeat='role in roles' ng-click="selectRow(role) 
     " ng-class="{selectedRole: role.selected==true}">{{role.roleName}}---{{role.selected}}</li> 

function TodoCtrl($scope) { 
    $scope.roles = [{roleName:"abc"}, {roleName:"dc"}] 
    $scope.name = 'Superhero'; 

    $scope.selectRow = function(role){ 
     role.selected = !role.selected; 
    }; 
} 

https://jsfiddle.net/U3pVM/30783/