Angularjs 如何处理Restanglar上分页的内容范围？

我使用的API返回列表的标题“内容范围”：

Request : GET /users
Response contains : Content-Range: 0-49/1337

使用restanglar概括此标头值的检索（和解析）的正确方法是什么

我必须要做我自己的功能吗

是否有一个现有的方法可以“捕获”每个响应，检查是否有标题，然后将解析的值（即：限制、范围、总计数、页码）附加到Restanglar返回的对象？

Restanglar用于捕获响应。您可以在那里捕获您的响应并获得

response.headers

您应该在拦截器中返回重新角度化的元素否则您无法在控制器或服务中获取任何数据

所以一个例子可以是这样的

    RestangularProvider.addResponseInterceptor(function (data, operation, what, url, response, deferred) {

        var data = response.data;
        var contentRange = response.headers("Content-Range");

        if (contentRange) {
            data.limit = contentRange.limit;
        }

        return data;
    });

---

正如您所见，在@wickY26 solution上经过几次迭代后，您可以通过注入

restanglarProvider

在任何angular config博客上添加restanglar response interceptor，这是一种对我很有效的技术：

先决条件 如问题中所述，API响应包含以下标题：

Content-Range: 0-9/150

这意味着：返回的列表将从第1个元素开始（从0开始），直到第9个元素，总共150个

另一方面，请求必须包括“范围=x-y”：

下面的代码只能在这些约束条件下工作

第一步 使restanglar从API获取所有传入响应。如果我们有一个“Content Range”标题，那么就附加一个分页对象，其中包含关于分页的所有重要信息（from、to、total、numPage、currentPage）：

第二步 使restanglar截获对API的所有传出请求。当操作是一个getList时，我们会在下一个查询中附加“？range=10-20”

angular.module('myapp')
    .config(dataConfigRequest);

dataConfigRequest.$inject = ['RestangularProvider'];
function dataConfigRequest(RestangularProvider) {

    RestangularProvider.addFullRequestInterceptor(function (element, operation, what, url, headers, params, httpConfig) {
        if (operation === 'getList') {
            if (Object.keys(params).length) {
                params.range = ((params._page - 1) * params._perPage) + '-' + (params._page * params._perPage - 1);

                delete params._page;
                delete params._perPage;
            }
        }
    });
}

第三步 现在显示列表的控制器

function dashboardContentListCtrl($scope, dataService) {

    // Pagination starting values
    $scope.maxSize = 6;
    $scope.currentPage = 1;
    $scope.limit = 20;

    $scope.pageChanged = function () {
        $scope.params = {_page: $scope.currentPage, _perPage: $scope.limit};

        dataService.getAllContents($scope.params).then(function (contents) {
            $scope.pagination = contents.pagination;

            $scope.contents = contents.plain();

        }).catch(function () {

            $scope.contents = [];
        });
    };

    $scope.pageChanged();

在我的应用程序上，分页视图组件是角度ui分页指令，如下所示：

<pagination class="pagination-sm" 
boundary-links="true" 
ng-hide="pagination.total < limit" 
total-items="pagination.total" 
items-per-page="limit" 
ng-model="currentPage" 
max-size="maxSize" 
rotate="false" 
ng-change="pageChanged()"></pagination>

我尝试了您的解决方案，但无法在response.headers中获取我的“Content Range”。@MartinH Works我为您制作了编辑。Headers是一个函数，因此您应该使用所需header参数的名称调用它。在您的例子中，它是“Conten Range”…好的，我必须修改我的API以添加：“访问控制公开标题”->“内容范围”，或者标题不可访问（尽管在响应中存在）。非常感谢。

function dashboardContentListCtrl($scope, dataService) {

    // Pagination starting values
    $scope.maxSize = 6;
    $scope.currentPage = 1;
    $scope.limit = 20;

    $scope.pageChanged = function () {
        $scope.params = {_page: $scope.currentPage, _perPage: $scope.limit};

        dataService.getAllContents($scope.params).then(function (contents) {
            $scope.pagination = contents.pagination;

            $scope.contents = contents.plain();

        }).catch(function () {

            $scope.contents = [];
        });
    };

    $scope.pageChanged();

<pagination class="pagination-sm" 
boundary-links="true" 
ng-hide="pagination.total < limit" 
total-items="pagination.total" 
items-per-page="limit" 
ng-model="currentPage" 
max-size="maxSize" 
rotate="false" 
ng-change="pageChanged()"></pagination>