Angularjs 如何使用ng grid使用selectall复选框？_Angularjs

Angularjs 如何使用ng grid使用selectall复选框？

angularjs

Angularjs 如何使用ng grid使用selectall复选框？,angularjs,Angularjs,在这里，我使用ng grid创建了一个记录，但我需要的是，当我选中selectAll复选框时，所选记录应显示在同一页面中。当我取消选中记录中的任何复选框时，selectAll复选框中的勾号不应出现在复选框中。这与我们在g-mail中使用的示例相同。请帮助我 ---这是我的index.html---- <!DOCTYPE html> <html ng-app="myApp"> <head lang="en"> <meta chars

在这里，我使用ng grid创建了一个记录，但我需要的是，当我选中selectAll复选框时，所选记录应显示在同一页面中。当我取消选中记录中的任何复选框时，selectAll复选框中的勾号不应出现在复选框中。这与我们在g-mail中使用的示例相同。请帮助我

---这是我的index.html----

<!DOCTYPE html>
<html ng-app="myApp">
    <head lang="en">
        <meta charset="utf-8">
        <title>Custom Plunker</title>  
        <link rel="stylesheet" type="text/css" href="http://angular-ui.github.com/ng-grid/css/ng-grid.css" />
        <link rel="stylesheet" type="text/css" href="style.css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
        <script type="text/javascript" src="http://angular-ui.github.com/ng-grid/lib/ng-grid.debug.js"></script>
        <script type="text/javascript" src="script.js"></script>
    </head>
    <body ng-controller="MyCtrl">

        <label>
            <input type="checkbox" 
                   ng-model="allChecked" 
            ng-click="checkAll()" /> Select All
        </label>
        <span ng-model="person.check" ng-click="changeCheckAll()">
        <div class="gridStyle" ng-grid="gridOptions" ></div>
        </span>



        <span ng-repeat="person in people | filter: {check:true}">
        <div class="gridStyle" ng-grid="gridOptions1" ></div>
        </span>  

    </body>
</html>

这是我的剧本

----script.js----

// Code goes here

// script.js
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
  $scope.people = [{
    name: "Moroni",
    age: 50,

  }, {
    name: "Tiancum",
    age: 43,

  }, {
    name: "Jacob",
    age: 27,

  }, {
    name: "Nephi",
    age: 29,

  }, {
    name: "Enos",
    age: 34,

  }];


   $scope.gridOptions = {
    data: 'people',
    columnDefs: [{field: 'check',
      displayName: 'Check',
      cellTemplate: '<input type="checkbox">'
    }, {
      field: 'age',
      displayName: 'Age'
    },  {
      field: 'name',
      displayName: 'Name'
    }]
  };






    $scope.gridOptions1 = {
    data: 'people',
    columnDefs: [ {
      field: 'age',
      displayName: 'Age'
    },  {
      field: 'name',
      displayName: 'Name'
    }]
  };


 $scope.checkAll = function() {
        for(var i=0; i < $scope.people.length; i++) {
            $scope.people[i].check = $scope.allChecked;
        }
    };


    $scope.changeCheckAll = function() {
        for(var i = 0; i < $scope.people.length; i++) {

            if (!$scope.people[i].check) {
                $scope.allChecked = false;
                return false;
            }
        }


        $scope.allChecked = true;
    };
});

这是我的plnkr:

使用showSelectionCheckbox设置网格选项。这里是链接

您的ng model=person.check应该在ng repeat block中，但即使现在我也得到了相同的答案。。。。。