为什么有时我需要刷新网页才能看到我从 api 检索到的数据出现在我的表格上？

Question

我使用 asp.net 创建了一个 API，并使用 angular 作为前端。我能够很好地获取数据，但有时我需要刷新页面一次或多次才能真正看到我表上的数据。我完全不知道为什么会发生这种情况。我希望我在下面插入的代码足以找到我的问题的解决方案这是我的表格组件的打字稿文件import { Component, OnInit } from '@angular/core';import { Router } from '@angular/router'; import {DataService} from 'src/app/Services/data.service';import {Anime} from 'src/app/Classes/anime';import { NgModule } from '@angular/core';import {MatDialog, MatDialogConfig } from '@angular/material/dialog';import { DialogComponent } from 'src/app/dialog/dialog.component';@Component({  selector: 'app-anime-table',  templateUrl: './anime-table.component.html',  styleUrls: ['./anime-table.component.css']})export class AnimeTableComponent implements OnInit {  AnimeArray : Anime[] = [] ;  data = false;  constructor(private router : Router,     private dataService : DataService,    private Dialog: MatDialog    ) {}  ngOnInit(){    this.dataService.GetAnime()    .subscribe(data =>  data.forEach(element => {      var anime = new Anime();      anime.AnimeID = element.AnimeID;      anime.AnimeName = element.AnimeName;      anime.Anime_Description = element.Anime_Description;      this.AnimeArray.push(anime);    }))  }// ngOnInit}//Export

Answer 1

首先尝试映射数据并替换整个数组，而不是推入数组。

ngOnInit() {

    this.dataService.GetAnime().subscribe(data => data =>

      (this.AnimeArray = data.map(element => {

        var anime = new Anime();

        anime.AnimeID = element.AnimeID;

        anime.AnimeName = element.AnimeName;

        anime.Anime_Description = element.Anime_Description;

        return anime;

      }))

    );

  } // ngOnInit