Question

我正在使用angularjs 1.6和ui-router。

我正在从rest api解析数据以绑定到ui-router状态的组件。下面的代码有效但服务器也返回一个标题：'X-Total-Count'，我也需要将它绑定到组件。

如何访问该请求中返回的标头并使用它们设置其他已解析的值？

ui-router状态：

$stateProvider.state({
  name: 'customers',
  url: '/customers?page&query',
  component: 'customerTable',
  resolve: {
    customers: function(Customer, $stateParams) {
      // a lot of code here to set the filter...
      return Customer.find({filter: filter})
        .$promise
        .then(
          function(res) {
            return res;
          }
        );
    },
    totalCount: function() {
      // How can I set this from the response returned above?
    }
  }
});

和组件：

.component('customerTable', {
  templateUrl: 'customer-table.html',
  controller: CustomerTableCtrl,
  bindings: {
    customers: '<',
    totalCount: '<'
  }
})

另外，我在服务器上使用LoopBack 3。感谢

Answer 1

我有一个解决方案。在此发布以供将来参考。要点是：

在Customer.find（）而不是$promise.then()上使用回调，以便我可以访问标题
在$ q中包装Customer.find（），以便它返回一个承诺
解析customers:和totalCount:的功能，等待data:承诺解决

代码：

resolve: {
  limit: function() {
    return 100; // max items per page
  },
  page: function($stateParams) {
    return parseInt($stateParams.page) || 1;
  },
  query: function($stateParams) {
    return $stateParams.query;
  },
  filter: function(limit, page, query) {
    // use limit, page and query
    // to create the filter object here...
  },
  data: function(Customer, filter, $q) {
    return $q(function(resolve, reject) {
      Customer.find({filter: filter}, function(data, headers) {
        resolve({
          customers: data,
          totalCount: headers('x-total-count')
        });
      }, function(err) {
        reject('error');
      });
    });
  },
  customers: function(data) {
    return data.customers;
  },
  totalCount: function(data) {
    return data.totalCount;
  }
}

ui-router解决回调内的多个值

1 个答案: