2016-04-11 10 views
0

各行のチェックボックスを使用して選択を実装しようとしているNGテーブルがあります。ng-table:各行のチェックボックスの選択

<table id="List" class=" table table-bordered table-striped" 
    ng-table="tableParams" show-filter="true" template-pagination="custom/pager"> 

<tbody> 
     <tr ng-repeat="item in $data" > 
      <td style="width: 35px"> 
    <input type="checkbox" name="selectedIds[]" value="{{item.id}}" ng-checked="isRowSelected(item.id)" ng-click="toggleSelection(item.id)" /> 
     </td> 
<td data-title="'Name'" sortable="'Name'" filter="{ 'Name': 'text' }" > 
     {{ item.Name}} </a> 

    </td> 
    <td data-title="'Email'" sortable="'Email'" > 
     {{ item.Email}} 
    </td> 
    <td data-title="'Phone Number'" sortable="'PhoneNumber'"> 
     {{ item.PhoneNumber}} 
      </td> 
    </tr> 

これはコントローラです:

angular.module("umbraco").controller("ListController", 
function ($scope, $http, $routeParams) { 
$scope.selectedIds = []; 
    $scope.toggleSelection = function (val) { 
      var idx = $scope.selectedIds.indexOf(val); 
      if (idx > -1) { 
       $scope.selectedIds.splice(idx, 1); 
      } else { 
       $scope.selectedIds.push(val); 
      } 
     }; 

     $scope.isRowSelected = function (id) { 
      return $scope.selectedIds.indexOf(id) >= 0; 
     }; 
     $scope.isAnythingSelected = function() { 
      return $scope.selectedIds.length > 0; 
     }; 
}); 

私は上記のコードは、任意の行のクリックですべての行を選択するが、個々の行を選択しようとしています。 これに関する提案はどうですか?

+0

あなたのようにjsfiddleを作ることができます例? –

答えて

2

あなたは正しく角度の電源を使用していない:) あなたはあなたのビューでそのような何かを試してみてください:

<input type="checkbox" ng-checked="item.isRowSelected" ng-click="toggleSelection(item)" /> 

とコントローラで:

$scope.toggleSelection = function(item){ 
    item.isRowSelected = !item.isRowSelected; 
} 


$scope.isAnythingSelected = function() { 
    for(var i = 0; i < $scope.data.length; i++){ 
     if($scope.data[i].isRowSelected === true){ 
      return true; 
     } 
    } 

    return false; 
}; 
関連する問題