angular2 如何在额外变量中存储来自 http.get 的响应 header 数据？

Question

我对 Angular 2 和 Typescript 很陌生，想构建一个 Card-Search 应用程序。基本上我有一个存储和观察响应数据的组件...

this.searchFormGroup.valueChanges
  .debounceTime(200)
  .distinctUntilChanged()
  .switchMap(searchFormGroup => this.mtgService.getCardsByName(searchFormGroup))
    .subscribe(
      searchResult => { 
        this.searchResult = searchResult.cards;
      },
      err => {
        console.log(err);
      });

...和一个服务，它将 http.get 请求发送到 API ...

getCardsByName(searchFormGroup){
   this.params.set(...) ...

   return this.http.get(this.nameUrl, { search: this.params })
     .map(res => res.json())
     .catch((error:any) => Observable.throw(error.json().error || 'Server error'))}

...相互交流。

在组件内部存储来自请求的 header-data 的最佳方式是什么？基本上我需要请求的总 card-count 和 paging-links，它们在响应 header 中可用。几个小时以来，我一直在努力寻找解决方案 :o

Answer 1

好的尝试和错误让我找到了解决这个问题的方法：组件激活服务的 http.get -> 服务响应 res.json() -> 组件仅在 JSON 中获得资源，似乎删除了响应 header。我的解决方法是：

组件：

this.searchFormGroup.valueChanges
  .debounceTime(200)
  .distinctUntilChanged()
  .switchMap(searchFormGroup => this.mtgService.getCardsByName(searchFormGroup))
    .subscribe(
      res => { 
        console.log(res.headers); //works fine now!
        this.searchResult = res.json().cards;
      },
      err => {
        console.log(err);
      });

服务：

getCardsByName(searchFormGroup){
   this.params.set(...) ...

   return this.http.get(this.nameUrl, { search: this.params })
     .catch((error:any) => Observable.throw(error.json().error || 'Server error')) }

所以完整的资源现在传回组件。

但是：有什么技巧可以使它变得更好吗？

angular2 如何在额外变量中存储来自 http.get 的响应 header 数据？

angular2 How to store response header data from http.get in extra variable?

get

header

http

response

angular