Javascript 将结果从promise推送到数组中

我试图清空，然后用承诺返回的值重新填充数组。然而，当我这样做时，它并不总是以相同的顺序添加它们

$scope.$watch ('timeRange', function (newValue, oldValue, scope){
     $scope.chartdata = []
     //If a filter has changed, redraw all charts
     if (newValue !== oldValue)
     {
        for(var i = 0; i< $scope.charts.length; i++){
           $scope.draw($scope.charts[i]).then(function(value){
               $scope.chartdata.push(value);
           });
        }
     }
}, true);

$scope.$watch（'timeRange'，函数（newValue，oldValue，scope）{
$scope.chartdata=[]
//如果筛选器已更改，请重新绘制所有图表
如果（新值！==旧值）
{
对于（变量i=0；i<$scope.charts.length；i++）{
$scope.draw（$scope.charts[i]）。然后（函数（值）{
$scope.chartdata.push（值）；
});
}
}
}，对）；

---

这将以ng重复显示。

由于您是异步执行操作，因此可能无法保证分辨率的顺序。您可以使用索引

i

而不是

push

$scope.$watch ('timeRange', function (newValue, oldValue, scope){
     $scope.chartdata = []
     //If a filter has changed, redraw all charts
     if (newValue !== oldValue)
     {
        for(var i = 0; i< $scope.charts.length; i++){
           $scope.draw($scope.charts[i]).then(function(i) { // create scope to capture i
               return function(value) { $scope.chartdata[i] = value; };
           }(i));
        }
     }
}, true);

$scope.$watch（'timeRange'，函数（newValue，oldValue，scope）{
$scope.chartdata=[]
//如果筛选器已更改，请重新绘制所有图表
如果（新值！==旧值）
{
对于（变量i=0；i<$scope.charts.length；i++）{
$scope.draw（$scope.charts[i]）。然后（函数（i）{//create scope to capture i
返回函数（值）{$scope.chartdata[i]=value；}；
}（i） ）；
}
}
}，对）；

UPD添加的示例仅用于演示@georgeawg范围的工作原理

var-arr=[1,2,3]；
对于（变量i=0；i}

由于您是异步操作的，因此可能无法保证解析顺序。您可以使用索引

i

而不是

push

$scope.$watch ('timeRange', function (newValue, oldValue, scope){
     $scope.chartdata = []
     //If a filter has changed, redraw all charts
     if (newValue !== oldValue)
     {
        for(var i = 0; i< $scope.charts.length; i++){
           $scope.draw($scope.charts[i]).then(function(i) { // create scope to capture i
               return function(value) { $scope.chartdata[i] = value; };
           }(i));
        }
     }
}, true);

$scope.$watch（'timeRange'，函数（newValue，oldValue，scope）{
$scope.chartdata=[]
//如果筛选器已更改，请重新绘制所有图表
如果（新值！==旧值）
{
对于（变量i=0；i<$scope.charts.length；i++）{
$scope.draw（$scope.charts[i]）。然后（函数（i）{//create scope to capture i
返回函数（值）{$scope.chartdata[i]=value；}；
}（i） ）；
}
}
}，对）；

UPD添加的示例仅用于演示@georgeawg范围的工作原理

var-arr=[1,2,3]；
对于（变量i=0；i}

有错误的代码段

函数randInt（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
函数asyncFunc（索引）{
返回新承诺（（解决）=>{
setTimeout（（）=>resolve（index），randInt（03000））；
});
}
常量结果=[]；
对于（变量i=0；i<5；i++）{
异步函数（i）
。然后（（ret）=>{
结果：推挤（ret）；
});
}
设置超时（（）=>{
控制台日志（结果）；
}, 4000);出现错误的代码段


函数randInt（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
函数asyncFunc（索引）{
返回新承诺（（解决）=>{
setTimeout（（）=>resolve（index），randInt（03000））；
});
}
常量结果=[]；
对于（变量i=0；i<5；i++）{
异步函数（i）
。然后（（ret）=>{
结果：推挤（ret）；
});
}
设置超时（（）=>{
控制台日志（结果）；
}, 4000);
实现这一点的干净方法是使用
.map
和
Promise.all
（或AngularJS中的
$q.all（）
）。这将维护项目的顺序，并且作为一个额外的好处，允许您检测何时填充了完整的数组

借用Gregory回答中的示例代码：

（注意：下面使用了
setTimeout
、
new Promise
和
Promise。所有这些都是为了提供一个简单的说明性演示，作为可运行的堆栈片段。在实际的AngularJS代码中，您不需要
setTimeout
或
new Promise
，您应该使用
$q.all
而不是
Promise.all
，如最后的示例所示）


函数randInt（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
功能延迟（毫秒）{
返回新承诺（函数（resolve）{setTimeout（resolve，ms）；}）；
}
函数asyncFunc（值）{
返回延迟（randInt（0，3000））
.then（函数（）{
log（值“finished”）；
返回值*2+1；
});
}
常数origaray=[0,1,2,3,4]；
Promise.all（origaray.map（asyncFunc））
.then（函数（resultArray）{
console.log（resultArray）；
})实现这一点的干净方法是使用
.map
和
Promise.all
（或AngularJS中的
$q.all（）
），这将保持项目的顺序，并且作为一个额外的好处，允许您检测何时填充了完整的数组

借用Gregory回答中的示例代码：

（注意：下面使用了
setTimeout
、
new Promise
和
Promise。所有这些都是为了提供一个简单的说明性演示，作为可运行的堆栈片段。在实际的AngularJS代码中，您不需要
setTimeout
或
new Promise
，您应该使用
$q.all
而不是
Promise.all
，如最后的示例所示）


函数randInt（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
功能延迟（毫秒）{
返回新承诺（函数（resolve）{setTimeout（resolve，ms）；}）；
}
函数asyncFunc（值）{
返回延迟（randInt（0，3000））
.then（函数（）{
log（值“finished”）；
返回值*2+1；
});
}
常数origaray=[0,1,2,3,4]；
Promise.all（origaray.map（asyncFunc））
.then（函数（resultArray）{
console.log（resultArray）；
})；
@danh添加了
$q.all
代码示例。不确定angular 1是否知道