Question

在视图屏幕上，您无法获得所需的json键值。我尝试了以下内容。 board.component.html

board.component.html

{{board.title}}＆gt; [对象]，

{{board？.title}}＆gt;没什么，

{{board | Json}}＆gt; [{＆＃34; title＆＃34; ：＆＃34; AAAAAA＆＃34;，＆＃34; cont＆＃34; ：＆＃34; AAAA1234＆＃34;，＆＃34; date＆＃34; ：＆＃34; 2017-03-03＆＃34;，＆＃34; hit＆＃34; ：＆＃34; 5＆＃34; }]

board.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

你应该使用* ngFor，因为board是一个数组。或者，如果您想访问第一个元素，可以执行此操作，

-webkit-columns: 3; /* Chrome, Safari, Opera */
-moz-columns: 3; /* Firefox */
columns: 3;

angular2它仅作为屏幕上的对象对象出现

1 个答案: