Question

我正在从此代码迁移（Angular 4＆lt;）Http：

     this.http.post(url, dto, httpOptions);
       .map(this.extractData)
       .catch(this.handleError);

到此代码（Angular 5）HttpClient：

this.httpClient.post<Hero>(this.URL, hero);

我读过这篇文章：http://brianflove.com/2017/07/21/migrating-to-http-client/

我的问题是，我不想在客户端上定义模型，因为它已在服务器上定义。我不想总是在这两个地方创建模型。为什么人们对此感觉不错？以旧方式，您不需要定义模型（Hero）。你只需从服务器上获取它并将其转换为JSON并继续前进...现在可能吗？

Answer 1

基本上，与v4模块相关的v5和HTTP之间没有太大区别。

您可以像以前一样放弃数据模型。这就是它的样子：

this.httpClient.post(this.URL, hero);

或者你可以使用<any> - 取决于你的编码风格：

this.httpClient.post<any>(this.URL, hero);

此外，您可以使用RxJS新的pipe运算符并重构您的代码，如下所示：

 this.httpClient.post(this.URL, hero);
   .pipe(
     map(this.extractData),
     catchError(this.handleError)
   );

要使errorHandler工作，请将由angular提供的此方法添加到您的代码中：

private handleError(error: HttpErrorResponse) {
  if (error.error instanceof ErrorEvent) {
    // A client-side or network error occurred. Handle it accordingly.
    console.error('An error occurred:', error.error.message);
  } else {
    // The backend returned an unsuccessful response code.
    // The response body may contain clues as to what went wrong,
    console.error(
      `Backend returned code ${error.status}, ` +
      `body was: ${error.error}`);
  }
  // return an ErrorObservable with a user-facing error message
  return new ErrorObservable(
    'Something bad happened; please try again later.');
};

Answer 2

您可以简单地省略类型参数或使用any，这不是必需的：

this.httpClient.post(this.URL, hero);

// or

this.httpClient.post<any>(this.URL, hero);

来自文档：

HttpClient.get（）方法将JSON服务器响应解析为匿名对象类型。它不知道该物体的形状是什么。

您可以告诉HttpClient响应的类型，使输出更容易，更明显。

https://angular.io/guide/http#type-checking-the-response

迁移到Angular 5 HttpClient

2 个答案: