- Add references to AngularJS. EG:
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.js"></script>
- Add references to ngTable's javascript and css files. EG:
<link rel="stylesheet" href="https://cdn.rawgit.com/esvit/ng-table/v1.0.0/dist/ng-table.min.css">
<script src="https://cdn.rawgit.com/esvit/ng-table/v1.0.0/dist/ng-table.js"></script>
- Where you declare your app module, add
ngTable
:
angular.module("myApp", ["ngTable"]);
- In your html file within the controller where you plan to use
ng-table
, add:
<table ng-table="vm.tableParams" class="table" show-filter="true">
<tr ng-repeat="user in $data">
<td title="'Name'" filter="{ name: 'text'}" sortable="'name'">
{{user.name}}</td>
<td title="'Age'" filter="{ age: 'number'}" sortable="'age'">
{{user.age}}</td>
</tr>
</table>
- In your javascript file within the controller where you plan to use
ng-table
, declare:
var self = this;
var data = [{name: "Moroni", age: 50} /*,*/];
self.tableParams = new NgTableParams({}, { dataset: data});