Javascript Can'；t访问then（）函数中的值的范围

在这节课中，对于一个角度分量，我有一个范围问题，我不明白

class ConnectionsComponent {
  constructor($http, $q) {
    this.$http = $http;
    this.$q = $q;
    this.listGotten = [];
    this.arrayOfGets = ['id1', 'id2', 'id3'];
  }

  $onInit() {
    var promises = [];

    angular.forEach(this.arrayOfGets, getThis => {
      var promise = this.$http.get('/api/endpoint/' + getThis)
      promises.push(promise)
    }) // end angular.forEach

    this.$q.all(promises).then((data) => {
      this.listGotten = data;
      console.log(this.listGotten) // <-- prints array of objects
    })

      console.log(this.listGotten) // <-- empty array (PROBLEM!)    

  } // end $oninit

} // end class

类连接组件{
构造函数（$http，$q）{
这个。$http=$http；
这.$q=$q；
this.listGett=[]；
this.arrayOfGets=['id1'，'id2'，'id3']；
}
$onInit（）{
var承诺=[]；
angular.forEach（this.arrayOfGets，getThis=>{
var promise=this.$http.get（'/api/endpoint/'+getThis）
承诺。推动（承诺）
})//end angular.forEach
这个.$q.all（承诺）。然后（（数据）=>{
this.listGett=数据；
console.log（this.listGett）/这是一个时间问题。稍后将调用您的
.then（）
处理程序，因为它表示所有异步操作的完成。然而，您的：

console.log(this.listGotten) // <-- empty array (PROBLEM!)  

然后，您将看到以下输出：

1 - start
2 - about to do .all()
4 - after .then() handler
3 - inside .then() handler

因此，您可以看到，在另一个
控制台.log（）执行之后，会调用
.then（）
处理程序

异步结果的解决方案是“在显示它们的回调中使用它们”，因为只有在回调中才知道它们存在的时间

记住，在异步代码中，所有的
$http.get（）
操作只是启动http请求，然后它们在后台运行。剩下的Javascript将继续运行，一段时间后，异步请求将在剩下的代码执行完毕后很长时间内完成并调用它们的回调。
发生这种情况是因为
这。$q.all
本身就是一个承诺（异步）当所有输入承诺都已解决时，将解决该问题。因此，在编写以下内容时：

this.$q.all(promises).then((data) => {
  this.listGotten = data;
  console.log(this.listGotten) // <-- prints array of objects
})

//This will be executed before the $q.all is resolved or rejected !
//or at least will not wait for $q.all to finish
console.log(this.listGotten) // <-- empty array (PROBLEM!)  

this.$q.all（承诺）。然后（（数据）=>{
this.listGett=数据；
console.log（this.listGett）//
this.$q.all(promises).then((data) => {
  this.listGotten = data;
  console.log(this.listGotten) // <-- prints array of objects
})

//This will be executed before the $q.all is resolved or rejected !
//or at least will not wait for $q.all to finish
console.log(this.listGotten) // <-- empty array (PROBLEM!)