无法通过 Angular 中的 GET 请求从 json 文件中获取数据

编程问答 2022-05-28

问题描述

我需要从 json GroupResult 对象中获取，但我对此很陌生，我在想，我做错了。

我的班级：

 export class GroupResult {
  Id!: number;
  Lecturer!: string;
  GroupName!: string;
  Subjects!: SubjectStatsstudent[];
}

export class SubjectStatsstudent {
  Id!: number;
  Name!: string;
  StudentResults!: StudentResult[];
}

export class StudentResult {
  Id!: number;
  Name!: string;
  Number!: number;
  LabPass!: number;
  LetionPass!: number;
  AllPass!: number;
  LabAvg!: number;
  TestAvg!: number;
  rating!: number;
}

我试着这样做：

(service.ts)

import {HttpClient} from '@angular/common/http';
import {Injectable} from '@angular/core';
import { Observable } from 'rxjs';
import { GroupResult } from '../model/group.results';

@Injectable({
    providedIn: 'root'
})

export class GroupService {
    gettest(): Observable<GroupResult> {
        return this.http.get<GroupResult>('../../assets/testGroup.json');
      }
}

(group.component.ts)

  ngOnInit(): void {
    this.groupService.gettest().subscribe((res: GroupResult) => this.Group = res);
    this.SelectedSubject = this.Group.Subjects[0];
  }

(testGroup.json)

{
    "Id": "777","Lecturer": "Ivanov","GroupName": "10701218","Subjects": [
      {
        "Id": "5","Name": "five","StudentResults": [
          {
            "Id": "5","Number": "1","LabPass": "1","LectionPass": "1","AllPass": "1","LabAvg": "1","TestAvg": "1","rating": "1"
          },{
            "Id": "3","Name": "two","Number": "2","LabPass": "2","LectionPass": "2","AllPass": "2","LabAvg": "2","TestAvg": "2","rating": "2"
          },{
            "Id": "7","Name": "tree","Number": "3","LabPass": "3","LectionPass": "3","AllPass": "3","LabAvg": "3","TestAvg": "3","rating": "3"
          }
        ]
      },{
        "Id": "7","Name": "f77777e","StudentResults": [

          {
            "Id": "5",{
        "Id": "3","Name": "fiv333e","rating": "3"
          }
        ]
      }


    ]
}

但我有类似 "Cannot read property 'Subjects' of undefined" 的错误。那我怎么理解， 我的组变量仍未定义/请告诉我我做错了什么？

解决方法

试试

"firestore": {
  "rules": "firestore.rules","indexes": "firestore.indexes.json"
},
angularangulargetjsontypescripttypescripttypescript