Angular2 Oninit with AfterViewInit

Question

ngOnInit() { 
      this.getPointsOfInterest(this.lat, this.lon).subscribe(
(response) => {this.data = response.json(); 
       this.lat = this.data.lat; 
       this.lon = this.data.lon; 
        }, 
(error) => console.log(error) 
} 

ngAfterViewInit() { 
    var src = { lat: this.lat, lng: this.lon }; 
    var map = L.map('map', { zoomControl: false }).setView(src, 14); 
} 

データはまだngAfterViewInit this.latおよびthis.lon = undefinedにアップロードされていません。

解決方法

Answer 1

私はあなたの要求の出力を観察するためにサブスクライブし、次にあなたが

ngOnInit() { 
    this.getData(); 
    } 

    getData() { 
    this.http.get('/app/data.json') 
     .map((res:Response) => res.json()) 
     .subscribe(
     data => { 
      this.data= data; 
      // actions with data 
     }, 
     err => console.error(err), 
     () => console.log('done') 
    ); 
    } 

Answer 2

ngAfterViewInitあなたはそれがないと思うように動作しませんデータで何をする必要があるかやることができると思います。 Angularは、子コンポーネントと現在のコンポーネントビューを初期化すると、このメソッドを呼び出します。

この時点で、非同期リクエストが完了していない場合があります。あなたはいつもその準備ができているとは思えません。ngAfterViewInit

あなたのデータは購読方法で使うべきです。 Life cycle hooks