Table with Sorting, Filtering, Pagination, Row Selection, Export, Checkbox, Bootstrap table styling features using ngTable, Twitter Bootstrap and AngularJS.

<!DOCTYPE html>
<html>

<head>
  <script data-require="jquery@*" data-semver="2.0.3" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
  <link data-require="bootstrap-css@3.1.1" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
  <script data-require="bootstrap@3.1.1" data-semver="3.1.1" src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  <script data-require="angular.js@1.2.14" data-semver="1.2.14" src="http://code.angularjs.org/1.2.14/angular.js"></script>
  <script data-require="ng-table@0.3.0" data-semver="0.3.0" src="http://bazalt-cms.com/assets/ng-table/0.3.0/ng-table.js"></script>
  <link data-require="ng-table@0.3.0" data-semver="0.3.0" rel="stylesheet" href="http://bazalt-cms.com/assets/ng-table/0.3.0/ng-table.css" />
  <script data-require="ng-table-export@0.1.0" data-semver="0.1.0" src="http://bazalt-cms.com/assets/ng-table-export/0.1.0/ng-table-export.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-app="tablePlunker" style="margin: 10px;">
  <h4 class="text-primary">Table with Sorting, Filtering, Pagination, Row Selection, Export, Checkbox, Bootstrap table styling features using ngTable, Twitter Bootstrap and AngularJS.</h4>
  <hr>
  <div ng-controller="GridController">
  <!-- <div>{{checkboxes.items}}</div>
  <div>
      <strong>Selected users:</strong> {{ data | filter:{"$selected": true} }}
  </div> -->
    
    
      <button ng-click="tableParams.sorting({})" class="btn btn-default pull-right">Clear sorting</button>
      <button ng-click="tableParams.filter({})" class="btn btn-default pull-right">Clear filter</button>
      <a class="btn btn-primary" ng-click="csv.generate()" ng-href="{{ csv.link() }}" download="test.csv">Export to CSV</a>
      <br/><br/><br/>
      <table ng-table="tableParams" class="table ng-table-rowselected table-hover table-condensed table-striped table-responsive" show-filter="true" template-pagination="pager" export-csv="csv">
          <tr ng-repeat="user in $data" ng-click="user.$selected = !user.$selected; changeSelection(user)"
                    ng-class="{'active': user.$selected}">
            <td width="30" style="text-align: left" header="'tableCheckUncheckAll'">
                <input type="checkbox" ng-model="checkboxes.items[user.id]" />
            </td>
            <td data-title="'Name'" sortable="name" filter="{ 'name': 'select' }" filter-data="names($column)">{{user.name}}</td>
            <td data-title="'Age'" sortable="age" filter="{ 'age': 'age' }">{{user.age}}</td>
          </tr>
      </table>
  </div>
  
  <script type="text/ng-template" id="pager">
    <ul class="pager ng-cloak">
      <li ng-repeat="page in pages"
            ng-class="{'disabled': !page.active, 'previous': page.type === 'prev', 'next': page.type === 'next'}"
            ng-show="page.type === 'prev' || page.type === 'next'" ng-switch="page.type">
        <a ng-switch-when="prev" ng-click="params.page(page.number)" href="">&laquo; Previous</a>
        <a ng-switch-when="next" ng-click="params.page(page.number)" href="">Next &raquo;</a>
      </li>
      <li> 
        <select ng-model="pageSize" ng-change="params.count(pageSize);" class="dropdown">
          <option ng-repeat="size in ['10','25','50','100']">{{size}}</option>
    		</select>
      </li>
    </ul>
  </script>
  <script type="text/ng-template" id="tableCheckUncheckAll">
      <input type="checkbox" ng-model="checkboxes.checked" id="select_all" name="filter-checkbox" value="" />
  </script>
    
  <script type="text/ng-template" id="ng-table/filters/age.html">
      <input type="radio" ng-model="params.filter()[name]" name="filter-age" value="" /> None
      <br />
      <input type="radio" ng-model="params.filter()[name]" name="filter-age" value="50" /> 50 years
  </script>
</body>

</html>

var app = angular.module('tablePlunker', ['ngTable']).
controller('GridController', function($scope, $filter, $sce, $q, ngTableParams) {
    var data = [{id: 1, name: "Moroni", age: 50, money: -10},
                {id: 2, name: "Tiancum", age: 43,money: 120},
                {id: 3, name: "Jacob", age: 27, money: 5.5},
                {id: 4, name: "Nephi", age: 29,money: -54},
                {id: 5, name: "Enos", age: 34,money: 110},
                {id: 6, name: "Tiancum", age: 43, money: 1000},
                {id: 7, name: "Jacob", age: 27,money: -201},
                {id: 8, name: "Nephi", age: 29, money: 100},
                {id: 9, name: "Enos", age: 34, money: -52.5},
                {id: 10, name: "Tiancum", age: 43, money: 52.1},
                {id: 11, name: "Jacob", age: 27, money: 110},
                {id: 12, name: "Nephi", age: 29, money: -55},
                {id: 13, name: "Enos", age: 34, money: 551},
                {id: 14, name: "Tiancum", age: 43, money: -1410},
                {id: 15, name: "Jacob", age: 27, money: 410},
                {id: 16, name: "Nephi", age: 29, money: 100},
                {id: 17, name: "Enos", age: 34, money: -100}];
    $scope.data = data;
    $scope.changeSelection = function(user) {
      $scope.data = user;
    }
    
    $scope.tableParams = new ngTableParams({
        page: 1,            // show first page
        count: 10,          // count per page
        filter: {
            //name: 'M'       // initial filter
        },
        sorting: {
            //name: 'asc'     // initial sorting
        }
    }, {
        total: data.length, // length of data
        getData: function($defer, params) {
            // use build-in angular filter
            
            var filteredData = params.filter() ?
                    $filter('filter')(data, params.filter()) :
                    data;
            var orderedData = params.sorting() ?
                    $filter('orderBy')(filteredData, params.orderBy()) :
                    data;
            
            $scope.users = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());
            
            params.total(orderedData.length); // set total for recalc pagination
            $defer.resolve($scope.users);
        }
    });
    var inArray = Array.prototype.indexOf ?
            function (val, arr) {
                return arr.indexOf(val)
            } :
            function (val, arr) {
                var i = arr.length;
                while (i--) {
                    if (arr[i] === val) return i;
                }
                return -1
            };
    $scope.names = function(column) {
        var def = $q.defer(),
            arr = [],
            names = [];
        angular.forEach(data, function(item){
            if (inArray(item.name, arr) === -1) {
                arr.push(item.name);
                names.push({
                    'id': item.name,
                    'title': item.name
                });
            }
        });
        def.resolve(names);
        return def;
    };
    $scope.checkboxes = { 'checked': false, items: {} };
    // watch for check all checkbox
    $scope.$watch('checkboxes.checked', function(value) {
        angular.forEach($scope.users, function(item) {
            if (angular.isDefined(item.id)) {
                $scope.checkboxes.items[item.id] = value;
            }
        });
    });
    // watch for data checkboxes
    $scope.$watch('checkboxes.items', function(values) {
        if (!$scope.users) {
            return;
        }
        var checked = 0, unchecked = 0,
            total = $scope.users.length;
        angular.forEach($scope.users, function(item) {
            checked   +=  ($scope.checkboxes.items[item.id]) || 0;
            unchecked += (!$scope.checkboxes.items[item.id]) || 0;
        });
        if ((unchecked === 0) || (checked === 0)) {
            $scope.checkboxes.checked = (checked == total);
        }
        // grayed checkbox
        angular.element(document.getElementById("select_all")).prop("indeterminate", (checked !== 0 && unchecked !== 0));
    }, true);
});

/* Styles go here */

.ng-table tr.emphasis td {
    background-color: #DDD;
    font-weight: bold;
}

.ng-table-rowselected tr {
    cursor: pointer;
}

Table with Sorting, Filtering, Pagination, Row Selection, Export, Checkbox, Dynamic Columns, Bootstrap table styling features using ngTable, Twitter Bootstrap and AngularJS.