Angular js ui-bootstrap分页链接不起作用

时间:2014-09-05 05:47:04

标签: angularjs twitter-bootstrap laravel angular-ui angular-ui-bootstrap

我使用ui-bootstrap paginator进行服务器端分页,但分页链接似乎不起作用。我使用Laravel rest api作为后端从服务器获取数据。显示第一组数据,但是当我点击第2页时没有任何反应

我的角度控制器

angular.module('myApp').controller('homeController', function($scope, $http, $location, $routeParams, Api, flash) {
$scope.flash = flash;
$scope.currentPage = 1;
$scope.numPerPage = 2;
$scope.result = [];
$scope.resultUser = function() {
    if ($routeParams.id) {
        $scope.CurrentValue = Api.Users.get({
            id: $routeParams.id
        });
    } else {
        $scope.CurrentValue = new Api.Users();
        Api.Users.query(function(response) {
            $scope.result = response.result.data;
            $scope.totalPages = response.result.last_page;
            $scope.resultCount = response.result.total;
        });
    }
};
$scope.resultUser();
})

我的服务

angular.module('myApp').factory('Api', ['$resource',
function($resource) {
    return {
        Users: $resource('users/:id', {}, {
            query: {
                method: 'GET',
            },
            post: {
                method: 'POST',
                isArray: true
            },
            update: {
                method: 'PATCH',
                id: '@id'
            },
            remove: {
                method: 'DELETE'
            }
        }),
        News: $resource('news/:id', {}, {
            query: {
                method: 'GET',
            },
            post: {
                method: 'POST',
                isArray: true
            },
            update: {
                method: 'PATCH',
                id: '@id'
            },
            remove: {
                method: 'DELETE'
            }
        }),
        Search: $resource('users/find', {}, {
            query: {
                method: 'POST'
            }
        }),
    }
    }
])

服务器端UserController

public function index() {
    $result = User::paginate($limit = 2);
    return Response::json(array('result' => $result->toArray()));
}

我的观点

<table class="table table-striped table-bordered table-hover" id="dataTables-example">
            <thead>
              <tr>
                <th>s.n</th>
                <th>Name</th>
                <th>E-mail</th>
                <th>Username</th>
                <th>Action</th>
              </tr>
            </thead>
            <tbody>

                    <pagination total-items="resultCount" ng-model="currentPage" max-size="5" 
                        boundary-links="true"items-per-page="numPerPage" class="pagination-sm">
                    </pagination>
                  <tr ng-repeat="result in result | filter : paginate">
                     <!-- <tr ng-repeat="result in result | filter:query "> -->
                      <div><%currentPage%> &nbsp;
                    <td>
                      <div class="action-checkbox">
                        <input id="<%result.id%>" type="checkbox" value="<%result.id%>" ng-checked="selection.indexOf(result.id) > -1" ng-click="toggleSelection(result.id)" />
                        <label for="<%result.id%>"></label>
                          <%result.id%>
                      </div>
                    </td>
                    <td>
                      <%result.name%>
                    </td>
                    <td>
                      <%result.email%>
                    </td>
                    <td>
                      <%result.username%>
                    </td>
                    <td>
                      <a href="#/users/edit/<%result.id%>" class="btn btn-small btn-primary">edit</a>
                      <button ng-click="delete(result.id)" class="btn btn-danger">Delete</button>
                    </td>
                  </tr>
                </div>
            </tbody>
          </table>

0 个答案:

没有答案