ui-routerはコールバック内で複数の値を解決します

Question

私はangularjs 1.6とui-routerを使用しています。

残りのAPIからのデータを解決して、ui-router状態のコンポーネントにバインドします。以下のコードは動作しますが、サーバはヘッダ 'X-Total-Count'も返すので、コンポーネントにバインドする必要があります。

このリクエストで返されたヘッダーにアクセスして、他の解決済みの値を設定するにはどうすればよいですか？

UI-ルータの状態：

$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: '<' 
    } 
}) 

、私は、サーバー上のループバック3を使用しています。ありがとう

Answer 1

私は解決策があります。将来の参照のためにここに投稿してください。キーポイントは以下のとおりです。Customer.find上

• 使用コールバック（）の代わりに$promise.then()のそれはのための約束
• 解決機能を返すので、私は$ Qにヘッダ
• ラップCustomer.findを（）にアクセスすることができますcustomers:とdata:約束のためtotalCount:待機解決する

コード：

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; 
    } 
}