为什么ng-table显示数据但没有设计分页

时间:2017-10-30 11:08:49

标签: javascript angularjs angularjs-directive angularjs-ng-repeat ngtable

我能够显示数据,但为什么分页根本没有设计。即使我在我的索引页面中包含了ng-table.min.css。 我关注的教程是this链接

分页错误:

enter image description here

这是我的控制器中的代码:

 var module = angular.module('myApp.controller', ['myApp.service','ngTable']);
 module.controller('HomeController', ['HomeService', '$window','$filter', 'ngTableParams',
 function (HomeService, $window, $filter, ngTableParams) {

    var self = this;
    self.EmpData = [];

    HomeService.getAllEmployeesTable().then(onSuccess, onError);

    function onSuccess(response) {
        self.EmpData = response.data;
        self.usersTable = new ngTableParams({   page: 1, count: 4}, 
            {
                total: self.EmpData.length,
                getData: function ($defer, params) {

                    self.data = self.EmpData.slice((params.page() - 1) * params.count(), params.page() * params.count());
                    $defer.resolve(self.data);
                }});}

在我的Partial html中,我有这段代码:

<div class="card-body">
 <table ng-table ="home.usersTable" class="table table-striped">
    <thead>
        <tr>
            <th>ContactId</th>
            <th>Name</th>
            <th>Email</th>
            <th>Address</th>
            <th>Telephone</th>
        </tr>
    </thead>

    <tbody>
        <tr ng-repeat="rods in home.data">
            <td>{{rods.contactId}}</td>
            <td>{{rods.name}}</td>
            <td>{{rods.email}}</td>
            <td>{{rods.address}}</td>
            <td>{{rods.telephone}}</td>
            <td><a class="btn btn-outline-info" href="edit" role="button"
                ng-click="home.Edit(rods)">Edit</a>
                <button type="button" class="btn btn-outline-danger"
                    ng-click="home.deleteEmployee($index)">Delete</button>
        </tr>
    </tbody>
 </table>
 <a class="btn btn-primary" href="create" role="button">Add</a>
 <button class="btn btn-outline-success my-2 my-sm-0" type="submit"
    ng-click="home.test()">test</button>
 </div>

0 个答案:

没有答案