Angular 2 injectable 비동기 실행

Question

Angular와 RxJS를 사용하여 프로젝트를 작성하고 있습니다.

내가 AppComponent의 생성자에 RosterService를 주입 한 후

import {Injectable, Inject} from '@angular/core'; 
import {Http} from '@angular/http'; 
import 'rxjs/add/operator/map'; 

import {Student} from './student.data'; 

@Injectable() 
export class RosterService { 
    private students : Student[]; 
    constructor(@Inject(Http) private http:Http){} 

    private getStudents(){ 
     this.http.get('/JSON/students.json') 
      .map(data => data.json().students) 
      .subscribe(data => this.students = data); 
    } 

    public getRoster() { 
     this.getStudents(); 
     return this.students; 
    } 
} 

(공급자로 @Component에 포함) :이 같은 JSON에서 데이터를 검색하는 주사 클래스 구현

export class AppComponent { 
    public students : Student[]; 
    constructor(private _rosterService : RosterService) { 
     this.students = _rosterService.getRoster(); 
    } 
} 

을하지만 getRoaster를 호출 할 때() 메서드를 호출하면 getStudents (async get 호출)가 실행될 때까지 기다리지 않습니다. 결과에서 나는 정의되지 않은 값을 얻는다.

어떻게 처리 할 수 ​​있습니까? 응답 해 주셔서 감사합니다.

Answer 1

당신이

getRoster(): Observable<Student[]>{ 
     return this.http.get('/JSON/students.json') 
      .map(data => data.json().students); 
    } 

같은 Observable<Student[]> from the getRoster` 방법을 반환하고 이외에 app component

export class AppComponent { 
    public students : Student[]; 
    constructor(private _rosterService : RosterService) { 
     _rosterService.getRoster().subscribe(students => this.students = students); 
    } 
} 

에 결과에 가입해야합니다, ngOnInit에서 서비스를 호출하는 것이 좋습니다 OnInit 인터페이스를 구현합니다.