Question

我正在尝试将JSON哈达加载到Angular 2组件中，我想我已经找到了方法。

datoer.service.ts：

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class DatoService { 

    dato: Array<any>;

    constructor(private http: Http) {}

        getDato() {
            return this.http.request('./datoer.json')
                 .map(res => res.json());
        }   
}

kalender.component.ts：

import { Component } from '@angular/core';
import { ValgteSkolerService } from '../valgteSkoler.service';
import { DatoService } from './datoer.service';

@Component({
    selector: 'kalender',
    providers: [DatoService],
    templateUrl: 'app/kalendervisning/html/kalender.html'
})
export class KalenderComponent {

    private valgteSkoleRuter: Array<any>= [];
    //private datoer: Array<any> = [];

    constructor(private valgteSkolerService: ValgteSkolerService, private DatoService: DatoService) {
        this.datoer = this.DatoService.getDato();
    }

    ngOnInit() {
      this.valgteSkolerService.hentLagretData();
      this.valgteSkoleRuter = this.valgteSkolerService.delteValgteSkoleRuter;
    }

我的模板如下：

<p *ngFor="let dato of datoer"> {{dato}}  </p>

我的问题是组件中的this.datoer。它说它在KalenderComponent类型上不存在。我尝试在组件中声明它：

private datoer: Array<any> = [];

然后它说＆＃34; Type＆＃39; Observable＆＃39;不能分配给任何[]＆＃39;类型。物业长度＆＃39;类型＆＃39; Observable＆＃39;

中缺少

任何想法如何解决这个问题？

Answer 1

根据Angular2 Http class docs，http服务返回ArrayList<>而不是带有结果的数组，这是因为它是异步进行的。因此，您必须observable到subscribe，以便在数组获得observable时为其提供数据（当http请求完成时会发生这种情况）。

例如：

notified

将JSON数据加载到Angular 2 Component中

1 个答案: