时间戳

首页 > 解决方案 > 如何将多个 json 数据解析为 Angular 中的对象数组？

arrays - 如何将多个 json 数据解析为 Angular 中的对象数组？

问题描述

我试图将多个 json 对象读入 Angular 中的数组，但不知道如何将多个 json 对象解析为对象数组并将其映射到博客对象数据字段

JSON数据

{
"Blogs":[
    {"title":"Demo Blog 1", "summary":"Demo Blog 1 summary"},
    {"title":"Demo Blog 2", "summary":"Demo Blog 2 summary"},
    {"title":"Demo Blog 3", "summary":"Demo Blog 3 summary"}
]
}

组件类

constructor(private appService: AppConfigService, private blogs: Blog[]) { }

showBlogResource(){
    this.appService.getBlogResource().subscribe((data: Blog[]) => {
      // read all blog data from json & store it into array blogs
    });
  }

服务等级

getBlogResource() {
    return this.http.get<Blog[]>(this.apiEndpoint + apiResource.blogs).pipe(retry(3), catchError(this.handleError));
  }

博客类

export interface Blog {
  title: string;
  summary: string;
}

标签： arraysjsonangulartypescriptangular-httpclient

解决方案

就像是

blogs: Blog[];
constructor(private appService: AppConfigService) { }

showBlogResource(){
    this.appService.getBlogResource().subscribe((data: Blog[]) => {
        this.blogs = data;
    });
}

并且可能将 getBlogResource 更改为（添加地图运算符以从 json 获取“博客”属性）

return this.http.get<Blog[]>(this.apiEndpoint + apiResource.blogs).pipe(map(res => res.Blogs), retry(3), catchError(this.handleError))

推荐阅读