用角度迭代数组 []

Question

当我调用 api 时，我有以下答案..

我有比这更多的属性，但我认为那比这更好

{
   "id":1,
   "FirstQuarter":[
      {
         "id":1,         
         "PLAYINFO":"Begin Period"
      }
   ]

有角度的模型

export class Match {
    id: number;
    live: boolean;
    teamA: String;
    teamB: String;
    codeTeamA: String;
    codeTeamB: String;
    actualQuarter: number;
    header: Header;
    FirstQuarter: FirstQuarter[];
}

export class FirstQuarter {   
    id: number;    
}

这是我的组件：

export class PlayByPlayComponent implements OnInit {
  match:Match;

  constructor(private _playByPlayService:PlayByPlayService,
    private route: ActivatedRoute,
    private router: Router) { }

  ngOnInit(): void {
    var matchId = this.route.snapshot.paramMap.get('matchId');
    this.getPlayByPlay(matchId);
  } 

  getPlayByPlay(matchId:String){ 
       
    this._playByPlayService.getPlayByPlaySyncronized(matchId).subscribe(    
      data=>{  
        this.match= JSON.parse(JSON.stringify(data));   
      },
      (error)=>{
        console.log("Error");
      }
    );
  }
}

我有以下服务文件夹

@Injectable({
  providedIn: 'root'
})
export class PlayByPlayService {

  private basketball:string = environment.basketball;

  constructor(private http: HttpClient) { }

  getPlayByPlaySyncronized(matchId:String): Observable<any>{    
    return this.http.get(this.basketball+"/api/public/v1/match/"+matchId);    
  }
 
}

我在像这样的角度模板中渲染结果

{{match.id}}
{{match.gameCode}}
{{match.gameCode}}
{{match.TeamA}}
<table class="table table-hover">
  <thead>
    <tr>
      <th scope="col">ID</th>
      <th scope="col"></th>       
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let match of match.FirstQuarter">
      <td>{{match.id}}</td>
    </tr>  
  </tbody>
</table>

它的打印效果像后续图像，但我无法打印第一季度

使用console.log的完整日志