角2のHTTP。配列

Question

に保管して応答だから私はAngular2

fetchData(){ 
    return this.http.get('https://ng-workout.firebaseio.com/Workouts/.json').map(
     (res) => res.json() 
    ); 
} 

でこのサービスを持っているし、このコンポーネント

export class HomeComponent { 

workouts = []; 

constructor(private dataService: DataService){ 
} 

ngOnInit(){ 
this.dataService.fetchData().subscribe(
    data=> this.workouts =data 
    ); 
    console.log(this.workouts); 
    } 
} 

だから事は、私がログコンソールとき、ある「this.workouts」は0を返し、空の配列。 jsonファイルのすべてのレコードは存在しないはずですか？

Answer 1

あなたは

ngOnInit(){ 
    this.dataService.fetchData().subscribe(
    data=> { 
     this.workouts =data; 
     console.log(this.workouts); 
    }); 
} 

fetchData（観測）は非同期です購読するに渡すコールバックにconsole.log()コードを移動する必要があります。購読するために渡す関数は、データが利用可能になったときに実行されます。