Angular zeigt nur einen Teil des resultierenden Datenarrays

Question

Fortsetzung des Beispiels here, und nachdem ein erfolgreiches API-Ergebnis erhalten, kann ich nicht die HTML-Komponente, um das gesamte Datenarray in der TypeScript-Komponente definiert anzuzeigen. Nur ein Feld ist aufgeführt. Hier

ist die todo.component.ts

import { Component, Inject } from '@angular/core'; 
import { Http } from '@angular/http'; 

@Component({ 
    selector: 'todo', 
    templateUrl: './todo.component.html' 
}) 
export class TodoComponent { 
    public todolist: todo[]; 

    constructor(http: Http, @Inject('BASE_URL') baseUrl: string) { 
     http.get(baseUrl +'api/todo').subscribe(result => { 
      this.todolist = result.json() as todo[]; 
     }, error => console.error(error)); 
    } 
} 
// 
interface todo { 
    Id: number; 
    TaskName: string; 
    IsComplete: boolean; 
    queueing: number; 
} 

Datei und hier ist die todo.component.html

<h1>To do List</h1> 

<p>This component demonstrates fetching tasks from the server.</p> 

<p *ngIf="!todolist"><em>Loading...</em></p> 

<table class='table' *ngIf="todolist"> 
    <thead> 
     <tr> 
      <th>ID</th> 
      <th>Task Name</th> 
      <th>Is complete</th> 
      <th>queueing</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr *ngFor="let item of todolist"> 
      <td>{{ item.Id }}</td> 
      <td>{{ item.TaskName }}</td> 
      <td>{{ item.IsComplete }}</td> 
      <td>{{ item.queueing }}</td> 
     </tr> 
    </tbody> 
</table> 

die gerenderte HTML

Was bin Ich mache falsch?

Answer 1

Bitte drucken Sie das Ergebnis von 'result.json()' in der Konsole aus.

Wie auch immer, Attribute beginnen normalerweise mit Kleinbuchstaben. mit Klein

interface todo { 
    id: number; 
    taskName: string; 
    isComplete: boolean; 
    queueing: number; 
} 

mit id, taskname und isComplete, wie die ‚Schlange stehen‘ Attribut: Vielleicht sollte die Schnittstelle sein.