如何使用 angular4 在我的组件中返回响应标头答案

【问题标题】：How return a response headers at my component with angular4如何使用 angular4 在我的组件中返回响应标头
【发布时间】：2018-04-05 13:22:23
【问题描述】：

大家好，我对 Angular4 有疑问。我需要向我的组件返回一个响应标头，但它还不起作用。我的组件代码示例：

this.filmService.create(this.film).subscribe(
  data => {
    console.log(data);
    //this.addFilmIntoDubberSelected();
    this.alertMessage = {
      "text": "Film has been created successfully!",
      "class": "success",
      "display": true
    }
  },
  err => {
    this.alertMessage = {
      "text": "Error occured!",
      "class": "danger",
      "display": true
    }
  }
);

我的服务示例：

create(film: Film) {
return this.http.post(this.urlRoot, film, {headers: this.headers})

} 这总是返回“null”！！！

对不起，我正在尝试更清楚地重写我的问题我需要访问响应标头，因为我必须能够读取 response.headers['location']。这是我的代码：

在用户组件中，我有一个调用我的服务的函数

create(){
  this.service.create(this.user).subscribe(
    data => {
     console.log(data);
    },
    err => {
     console.log(err);
    }
  );
}

我的服务是这样的：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

// Models
import { User } from '../_models/index';

@Injectable()
export class UserService {

  private url = "http://localhost:3000/users";

  // Inject HttpClient into your component or service.
  constructor(private http: HttpClient) {}

  ngOnInit(): void {}

  create(user: User) {
    return this.http.post(this.url, user);
  }

}

我该怎么办？

提前致谢

【问题讨论】：

我没有得到第一和第二位代码之间的联系。你能提供一个最小的、可重现的例子吗？
我在您编辑问题后更新了我的答案。希望我理解正确。

标签： angular function service return

【解决方案1】：

对我来说是这样的：

 public create(newFilm: Film): Observable<boolean> {
        let headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');
        let body = newFilm.generateUrlencodedParameters(this.auth.getCurrentUser().token);
        return this.http.post(Api.getUrl(Api.URLS.createHomeboxP), body, {
          headers: headers
        })
          .map((response: Response) => {
            let res = response.json();

            if (res.StatusCode === 0) {
              return true;
          });
      }

类.ts

 export class Film{
        id: string[];
        public generateUrlencodedParameters(token: string, id?: number): string {

            let urlSearchParams = new URLSearchParams();
            urlSearchParams.append('id', this.id.toString());

            return urlSearchParams.toString();
        }
    }

组件.ts

  public films: Film[] = [];

  this.cs.create().subscribe(
      films=> {
        this.films= films }

【讨论】：

【解决方案2】：

默认情况下，HttpClient 会将调用的返回视为 JSON，并会自动对其进行解析。您可以使用以下代码观察完整的 HTTP Response 对象：

this.http.get('…', { observe: 'response' });

POST 的工作方式相同。您将获得一个可以从中提取标题的对象。

或者，您可以配置 HTTP 拦截器。

查看short and precise article 了解更多信息。

【讨论】：