如何在自定义表格中标记AngularJs中的所有复选框？

Question

我有这个表格，我发送她的数据并显示它，加深了数据。我还添加了我想要的cheackbox输入，当我点击它时，他标记了所有的复选框，但他不能很好地工作。

这是angular的指令：

app.directive("tables", function(){
return {
template: '<table class="table table-striped table-bordered table-hover">'+
    '<thead>'+
    '<tr>'+
        '<th>#</th>'+
        '<th><input type="checkbox" ng-model="selectAll" ng-click="checkAll(values)" /></th>'+
        '<th ng-repeat="(key,label) in labels">'+
            '<a href="" ng-click="orderByField=key; reverseSort = !reverseSort">'+
            '{{ label }} '+
                '<span ng-show="orderByField == key" class="sortIcon">'+
                    '<span ng-show="reverseSort">'+
                        '<span class="glyphicon glyphicon-chevron-up"></span>'+
                    '</span>'+
                    '<span ng-show="!reverseSort">'+
                        '<span class="glyphicon glyphicon-chevron-down"></span>'+
                    '</span>'+
                '</span>'+
            '</a>'+
        '</th>'+
    '</tr>'+
'</thead>'+
'<tbody>'+
  '<tr ng-repeat="(what,items) in values | orderBy:orderByField:reverseSort | filter :searchInput  " >'+
    '<td>{{ $index +1 }}</td>'+
    '<td> <input type="checkbox" ng-model="user.select" value="{{ items[fieldId] }}"></td>'+
    '<td ng-repeat="(key,item) in items" ng-if="item != items[fieldId] ">{{item}}</td>'+
  '</tr>'+
'</tbody>'+
'</table>',
 link: function($scope) {

      $scope.checkAll = function(arraySelect) {
        angular.forEach(arraySelect, function(user) {
          user.select = $scope.selectAll;
        });
     };

    }
  }
});

以下是完整示例：jsFiddle

Answer 1

试试这样。 我在指令中将Traceback (most recent call last): File "/share/Web/python/dash_check.py", line 54, in <module> print ( sniff(prn=arp_display, filter="arp", store=0, count=10,lfilter=lambda pkt: ARP in pkt) ) File "/opt/lib/python2.7/site-packages/scapy/sendrecv.py", line 620, in sniffr = prn(p) File "/share/Web/python/dash_check.py", line 21, in arp_display if (flag == NULL) or (flag == 0): UnboundLocalError: local variable 'flag' referenced before assignment 定义为values。并从复选框中删除值。

Demo

scope

app = angular.module("myApp",[]);

app.controller('myCtrl', function($scope,$http){

	$scope.customers = [];
	$scope.orderByField = "first_name";
	$scope.reverseSort = false;
	$scope.pageTitle = "CUSTOMERS_TXT";
	$scope.fieldId = "id";
	
	$scope.values = [
                      {first_name: "Oded", last_name: "Taizi", id: 1,select:false},
                      {first_name: "Ploni", last_name: "Almoni", id: 2,select:false}
                      ];
	
	$scope.labels =  ["first_name","last_name"];
	
});

app.directive("tables", function(){
return {
  scope:{
	  values:'=values'
	},
   template: '<table class="table table-striped table-bordered table-hover">'+
		'<thead>'+
		'<tr>'+
			'<th>#</th>'+
	      	'<th><input type="checkbox" ng-model="selectAll" ng-click="checkAll(selectAll)" /></th>'+
			'<th ng-repeat="(key,label) in labels">'+
				'<a href="" ng-click="orderByField=key; reverseSort = !reverseSort">'+
				'{{ label }} '+
					'<span ng-show="orderByField == key" class="sortIcon">'+
		        		'<span ng-show="reverseSort">'+
		        			'<span class="glyphicon glyphicon-chevron-up"></span>'+
		        		'</span>'+
		        		'<span ng-show="!reverseSort">'+
		        			'<span class="glyphicon glyphicon-chevron-down"></span>'+
		        		'</span>'+
		        	'</span>'+
		        '</a>'+
			'</th>'+
		'</tr>'+
	'</thead>'+
	'<tbody>'+
	  '<tr ng-repeat="(what,items) in values | orderBy:orderByField:reverseSort | filter :searchInput  " >'+
	  	'<td>{{ $index +1 }}{{items}}</td>'+
	  	'<td> <input type="checkbox" ng-model="items.select" ></td>'+
	    '<td ng-repeat="(key,item) in items" ng-if="item != items[fieldId] ">{{item}}</td>'+
	  '</tr>'+
	'</tbody>'+
	'</table>',
   link: function($scope) {

          $scope.checkAll = function(selectAll) {
            angular.forEach($scope.values, function(user) {
             user.select = selectAll;
            });
         };

        }
      }
});