将部分返回的json数据分配给TypeScript和Angular2中的数组

时间:2017-04-28 06:36:01

标签: javascript json angular typescript

我目前正从具有各种字段的文件中检索json数据 - 我对2个字段感兴趣,并且我希望将它们设置为不同的数组。

SERVICE文件:

getCourseType(){
    return this._http.get('url')
     .map((res:Response) => <ICourseType[]> res.json())
     .do(data =>console.log('All: ' + JSON.stringify(data)))
     .catch(this.handleError);
}

COMPONENTS.ts文件:

courseType: ICourseType[];
courseName: any[] = [];
courseRoster: any[] = [];

getCourseType(){ //function called from ngOnInit()
    this.dataService.getCourseType().subscribe(
      data => this.courseType = data,
      error => this.errorMessage = <any>error);
  }

JSON文件:

[
  {
    "id": 1,
    "courseTitle": "English",
    "courseNumber": 340B,
    "roster": 23,
  },
  {
    "id": 2,
    "courseTitle": "AP History",
    "courseNumber": 1420,
    "roster": 14
  },
  {
    "id": 3,
    "courseTitle": "Art",
    "courseNumber": 42A,
    "roster": 30
  }
]

目前我返回json对象,但如果我有兴趣将每个课程的所有courseTitle收集到一个数组中,然后将每个课程的所有roster个数字合并为一个数组 - 我应该在哪里这样做?在服务中还是在我的组件中?

1 个答案:

答案 0 :(得分:1)

在您的组件文件

courseType: ICourseType[];
courseName: any[];
courseRoster: any[];

getCourseType(){ //function called from ngOnInit()
    this.dataService.getCourseType().subscribe(
      data => {
        this.courseType = data
        this.courseType.forEach(course=>{
             this.courseName.push(course.courseTitle);
             this.courseRoster.push(course.roster);
          })  
      },
      error => this.errorMessage = <any>error);
  }