typescript 将ObservableMap到对象数组

jogvjijk  于 2023-10-22  发布在  TypeScript
关注(0)|答案(4)|浏览(115)

我有一个REST API,它会返回JSON数组和数据。在客户端,我使用此代码从请求创建对象。

public getNews(): Observable<News[]> {

return this.http.get(this.baseUrl + '/news')
  .pipe(
    catchError(this.handleError('getNews', []))
  )
  .map(res => {
    let response: any = res;
    return response.map((item) => new News(item));
  });
}

订阅:

this.restProvider.getNews().subscribe((news: News[]) => {
  this.news = news;
});

但是,当响应不是数组而是单个元素时,我如何解决问题?或者响应错误,例如来自API的意外数据?
目前在这些情况下,我的应用程序抛出这个错误:
response.map不是函数

bt1cpqcv

bt1cpqcv1#

下面的代码可以帮助你处理错误:

this.restProvider.getNews().subscribe((news: News[]) => {
  this.news = news;
}, (err) => {
console.log(err);
});

您只需要在subscribe函数中添加error参数。
现在回到你的第一个问题:如果响应是单个对象呢?->函数的签名将始终强制它返回一个数组。错误将在订阅端生成。一个简单的解决方案是改变响应的数据类型。

this.restProvider.getNews().subscribe((news:any) => {
  this.news = news;
});
7bsow1i6

7bsow1i62#

代码,将始终返回数组:

public getNews(): Observable<News[]> {

return this.http.get(this.baseUrl + '/news')
  .pipe(
    catchError(this.handleError('getNews', []))
  )
  .map(res => {
    if(Array.isArray(res)) {
       return res.map((item) => new News(item));
     } else {
       return [new News(res)];
     }
  });
}
4dc9hkyq

4dc9hkyq3#

当响应是单个对象或数组时,显然这不是一致的行为,它使事情变得复杂。我假设后端不受您的控制。
您可以先检查响应类型,以确定它是Array还是Object。你可以使用Array.isArray()。然后如果响应不是数组,就转换它,像这样const res = [response]
从那时起,getNews()应该总是返回一个数组

k75qkfdt

k75qkfdt4#

我现在是Angular的新手,我对使用Angular Cli 16感到困惑,阅读这个答案,因为我发现当前(2023)使用HttpClient的简单解决方案。如果json被重新编译,它会自己转换为JSON,并且转换为正确的对象也很容易。

import { HttpClient} from '@angular/common/http';
import { Observable } from 'rxjs';
import { MyObject } from './myobject';

export class ProductsService {

  constructor(private _http : HttpClient){ }
  
  readMyObjects(): Observable<MyObjects[]>{
    return this._http.get<MyObjects[]>("http://url/to/api/");          
  }
}

仅此而已
Here我找到了一个简单的教程,然后,很明显,在我找到解决方案后,stackoverflow上也有很多帖子。Here one
我希望你喜欢

相关问题