*ngFor 不在 Angular 視圖中顯示我的 [object Object] 數據

Question

我正在嘗試迭代從我的 Angular 模板中的 fastAPI 后端端點返回的對象。 （我的數據實際上在那里，但我無法對其進行迭代，唯一可以使用的語法是使用 JSON 管道時），結果在我的前端是這樣的： EDIT ( DATA )

{  
"1": { "Id": 1, "ruleData": [], "ruleName": "someName", "testDesc": "", "test": "test", "ruleErrorMessage": "someError" } ,

"2": { "Id": 2, "ruleData": [], "ruleName": "someName", "testDesc": "", "test": "test", "ruleErrorMessage": "someError" } 
}

但數據沒有出現，這是我的模板代碼

 <h5 *ngFor="let smth of analysisResults.someData">
                   testets >>> {{smth}}
</h5>

我的服務代碼：

export class backend{
    backendURL="http://localhost:8000/doSomthing/";
    constructor(private httpclient: HttpClient){}
    requrl: string;
    
    getQuality(text: string){
        this.requrl=this.backendURL+text;
        return this.httpclient.get<AnalysisResults>(this.requrl)
    } 
}

我的 .ts 代碼：

constructor(private backend: backendService) { }
  req = new FormControl('');
  analysisResults: AnalysisResults;
  getQuality(reqValue: string) {
    this.backend.getQuality(reqValue)
      .subscribe((data: AnalysisResults) => this.analysisResults = {
          score:(data as any[])['score'] ,
          someData:(data as any[])['someData'] ,
      } ) } 

我的模型代碼：

export interface AnalysisResults {
    score?:number;
    someData?:[];
}

Answer 1

在接口中，您為 someData 定義了一個沒有類型的數組。 如果將其轉換為 any[]，則可以使用它。 否則它將是一個空數組，因為打字稿迫切需要一個類型。

export interface AnalysisResults {
  score?:number;
  someData?:any[];
}

請參閱 stackblitz 中的示例。 如果您刪除 any 類型並離開數組，stackblitz 會抱怨。 https://stackblitz.com/edit/angular-ivy-bovpdk?file=src/app/app.component.ts