从Http请求转换响应的问题

Question

我有这个HTTP请求：

storeCategory(file: File, category: CategoryModel): Observable<HttpEvent<{}>> {
    const formdata: FormData = new FormData();
    console.log("1")
    formdata.append('file', file);
    formdata.append('category', new Blob([JSON.stringify({ "category_name": category.category_name, "category_description": category.category_description })], { type: "application/json" }))
    const url = `api/cateogry/saveCategory`;
    const req = new HttpRequest('POST', url, formdata, {
      reportProgress: true,
      responseType: 'text'
    });
    return this.http.request<CategoryModel>(req);
  }

通过此方法，我发送数据和图像，我的后端方法返回一个JSON对象，但是我想将该对象绑定为CategoryModel，但现在它已绑定到HttpEvent。 / p>

我的回调： 另一张图片：

另一张图片：

Answer 1

从您发布的图像来看，请求似乎不是CategoryModel，而是CategoryModel对象中HttpResponse的列表。由于您使用的是http.request，因此您将获得许多响应，并且每个响应都有不同的HttpEventType found here。您需要过滤每种类型的响应，并根据类型（例如event.type === HttpEventType.Response）获取所需的内容。

尝试一下：

storeCategory(file: File, category: CategoryModel): Observable<CategoryModel[]> {
    const formdata: FormData = new FormData();
    console.log("1")
    formdata.append('file', file);
    formdata.append('category', new Blob([JSON.stringify({ "category_name": category.category_name, "category_description": category.category_description })], { type: "application/json" }))
    const url = `api/cateogry/saveCategory`;
    const req = new HttpRequest('POST', url, formdata, {
      reportProgress: true,
      responseType: 'text'
    });
    return this.http.request<any>(req).pipe(map(event => {
     console.log("event",event);
     if(event.type == HttpEventType.Response){ // try different event types based on desired result.
      event.body = event.body.replace(/\\/g,"/"); // replace all double backslashes with slash.
      return <CategoryModel[]>JSON.parse(event.body); // try to parse the data if it is a string
     }
    }));
  }

我将方法的返回类型更改为Observable<CategoryModel[]>，并更改了return语句以转换结果以反映该结果。

在组件中记住import {map} from 'rxjs/operators' 记得import {HttpEventType} from '@angular/common/http'在您的组件中

还要看看Angular docs

中的示例

可以找到不同的HttpEventType here

Answer 2

您需要创建CategoryModel类的对象并在构造函数中传递参数。

let resp = new CategoryModel(json_object[0]);