angular2 Es erscheint nur als Objektobjekt auf dem Bildschirm

Question

Auf dem Bildschirm Ansicht können Sie nicht den gewünschten JSON-Schlüsselwert abrufen. Ich habe Folgendes versucht. board.component.html

board.component.html

{{board.title}}> [Object],

{{Bord? .title}}> Nichts,

{{board | JSON}}> [{"title": "AAAAAA", "cont": "AAAA1234", "Datum": "2017-03-03", "Treffer": "5"}]

Karte. component.ts

@Component({ 
    selector : 'board', 
    templateUrl : './board.component.html' 
}) 

export class boardComponent implements OnInit{ 
    pageTitle : string = 'board'; 
    errorMessage : string; 
    board : Board[]; 

    constructor(private _boardService : BoardService){} 

    ngOnInit() : void { 
     this._boardService.getBoard() 
      .subscribe(
       boards => this.board = boards, 
       error => this.errorMessage = <any> error 
      ); 
     console.log('board In OnInit'); 
    } 
} 

board.service.ts

@Injectable() 
export class BoardService{ 
    private _boardUrl = '/src/api/board/board.json'; 

    constructor(private _http : Http){} 

    getBoard() : Observable<Board[]>{ 
     return this._http.get(this._boardUrl) 
      .map((response : Response) => <Board[]> response.json()) 
      .do(data => console.log('Board : ' + JSON.stringify(data))) 
      .catch(this.handleError); 
    } 

    private handleError(error : Response){ 
     return Observable.throw(error.json().error || 'Server error'); 
    } 
} 

Answer 1

sollten Sie * verwenden ngFor da Bord ein Array ist. Oder wenn Sie das erste Element zugreifen möchten, können Sie dies tun,

{{board[0]?.title}}