Angular HttpClient.get 标头答案

【问题标题】：Angular HttpClient.get headersAngular HttpClient.get 标头
【发布时间】：2018-08-31 00:40:22
【问题描述】：

我有这个简单的代码作为服务

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class SpotifyService {
  constructor(private http: HttpClient) {
  }

  getQuery(query: string) {
    const cabecera: HttpHeaders = new HttpHeaders({
      'Authorization': 'Bearer BQDWZC2Y_iSV3rfmAhv-QxDpmhhJbbmgCnspy7HpIZPX5CbJ74D4Xl4aOyXLUL4smF2gZ_V3wiSXLxdLFPY'
    });
    const url = 'https://api.spotify.com/v1/' + query;
    return this.http.get(url, { cabecera });
  }
  getNewReleases() {
    return this.getQuery('browse/new-releases').pipe(map( data => data['albums'].items));
  }
}

但是我收到了这个错误，我不明白为什么。

类型参数 '{ cabecera: HttpHeaders; }' 不可分配给 '{ headers?: HttpHeaders | 类型的参数{ [标题：字符串]：字符串 |细绳[]; };观察？：“身体”；参数？：Ht...'。目的文字只能指定已知属性，而 'cabecera' 不存在于类型 '{ headers?: HttpHeaders | { [标题：字符串]：字符串 | 细绳[]; };观察？：“身体”；参数？：Ht...'。

【问题讨论】：

标签： angular get header httpclient

【解决方案1】：

您的return this.http.get(url, { cabecera }); 行在语义上不正确，这意味着/解决以下问题：

return this.http.get(url, 
    { cabecera : new HttpHeaders({
        'Authorization': 'Bearer BQDWZC2Y_iSV3rfmAhv-QxDpmhhJbbmgCnspy7HpIZPX5CbJ74D4Xl4aOyXLUL4smF2gZ_V3wiSXLxdLFPY'
    }) 
});

这是错误的，因为传递给 HTTP 客户端的选项对象不希望有一个名为 cabecera 的键，而是一个 headers 键。

所以这可以简单地通过用这个替换行来解决：return this.http.get(url, { headers: cabecera });

【讨论】：

非常感谢，我两天前就开始学习了