オブジェクトの配列が変更された場合、角2 ngForは更新されません。

Question

私は、http get要求を使用してjsonオブジェクト配列を取得しようとしています。現在、私はevent.serviceコンポーネントのgetEvents（）を呼び出すlist-view.componentを持っています。この関数はオブジェクト配列を表すPromiseを返します。更新された配列はlist-view.componentに正常に返されますが、何らかの理由でコンソールで配列を出力しようとしたときに変更が反映されません。

リスト-view.component.ts

this.eventService.getEvents(lat, lon, range, s).then(events => this.eventsList = events); 
console.log(this.eventsList); 

event.service.ts

getEvents(lat: number, lon: number, radius: number, s: string): Promise<Event[]> { 
    return this.http.get(this.eventsUrl + "?s=" + s +"&radius=" + radius + "&lat=" + lat + "&lon=" + lon) 
     .toPromise() 
     .then(response => response.json() as Event[]) 
     .catch(this.handleError); 
    } 

私は以下のように、.then方法で配列を印刷しようとした場合、それが正しく、それを印刷します。

this.eventService.getEvents(lat, lon, range, s).then(events => console.log(events)); 

どのように私はthis.eventService.getEvents（）呼び出しの後に、それを印刷しようとすると、それは新しい変更を持っていない、来ますか？

Answer 1

約束が返される前にconsole.logステートメントが実行されるため、私はそれを言っています。約束が返ってきたらを実行したので.thenと動作します。

これが役に立ちます。

Answer 2

Promise.then()は非同期メソッドです。つまり、返された値はその外部で使用できません。お約束したeventsで返す必要があるものはすべて.then()に入れてください。

これは、メソッドが.then()を呼び出しているために発生しますが、Promiseはまだ解決されておらず、値がまだ設定されていません。

その後、方法は続行し、console.log()を印刷します。ある時間（ミリ秒/ナノ秒）後に、非同期操作が終了しました。あなたが作成した基本的に何である

fun test() { 
    setTimeout(() => { 
    console.log('Async operation ended'); 
    }, 2000); 

    console.log('Normal operation ended'); 
} 

：

あなたはそれをこのような何かを見ることができました。あなたのメソッドはsetTimeout()と呼ばれ、のタイムアウトを待たずにすぐにconsole.logに進みます。あなたはsetTimeout()（あなたの場合、あなたのthen()中）

fun test() { 
    setTimeout(() => { 
    console.log('Async operation ended'); 
    console.log('Normal operation ended'); 
    }, 2000); 

} 

以内にそれを含める必要があり、前に

非同期操作が

を終了し印刷するに