Javascript 使用promises在angularJS中建模异步数据
我正在用angularJS开发一个单页应用程序，在存储异步数据方面遇到了问题 为了简单起见，我基本上有一个服务，它保存一些作为承诺返回的数据模型（因为它们可以在任何给定时间异步更新） 我有一个有角度的手表，当某些条件改变时，它会更新这些模型。 我还有一个角度表，当某些条件改变时，它会使用这些数据 我的问题是： 使用数据的手表在更新此数据的手表之前启动，导致它立即使用“过时”数据而不是新的承诺启动 代码示例：Javascript 使用promises在angularJS中建模异步数据,javascript,angularjs,promise,deferred,Javascript,Angularjs,Promise,Deferred,我正在用angularJS开发一个单页应用程序，在存储异步数据方面遇到了问题 为了简单起见，我基本上有一个服务，它保存一些作为承诺返回的数据模型（因为它们可以在任何给定时间异步更新） 我有一个有角度的手表，当某些条件改变时，它会更新这些模型。 我还有一个角度表，当某些条件改变时，它会使用这些数据 我的问题是： 使用数据的手表在更新此数据的手表之前启动，导致它立即使用“过时”数据而不是新的承诺启动 代码示例： angular.module('myApp', []) .controller('myC
angular.module('myApp', [])
.controller('myController', function($scope, $q, asyncDataService) {
// This watch is called whenever we need to update the asyncData
$scope.$watch('variableThatCausesUpdate', function(newValue) {
// Set the async data to a new unresolved promise to reflect
// its pending nature
var newAsyncDataDeferred = $q.defer();
asyncDataService.setAsyncData(newAsyncDataDeferred.promise);
// fetch the async data (in my case it is an $http request.
// newAsyncDataPromise is the $http promise)
var newAsyncDataPromise = fetchAsyncData();
// resolve the newData promise with the result from this fetch
newAsyncDataPromise.then(function(newAsyncDataResult) {
// At this point the data is up to date
newAsyncDataDeferred.resolve(newAsyncDataResult.data);
});
});
// This watch is called to perform some action,
// but is watching the same variable as update
$scope.$watchCollection('[variableThatCausesUpdate, someOtherVariable]', function(newValue) {
// We want to ensure that our asyncData is up to date,
// since we will be using it in our action
asyncDataService.getAsyncData().then(function(asyncData) {
// Firing with the "stale" promise since it occurs before update
someActionRequiringOurAsyncData(asyncData);
})
/*
However I can fix the issue by doing this
(since it will be put at the end of the event queue)
But this seems ugly and maybe is the result of a bad design?
setTimeout(function() {
asyncDataService.getAsyncData().then(function(asyncData) {
someActionRequiringOurAsyncData(asyncData);
})
}, 0)
*/
});
});
我不能只观察已解决承诺的结果，因为其他变量也可以触发此手表，所以它不仅在特定数据更新时触发。既然下面的集合中有相同的var，为什么不完全删除第一个观察者呢
angular.module('myApp', [])
.controller('myController', function($scope, $q, asyncDataService) {
// This watch is called to perform some action,
// but is watching the same variable as update
$scope.$watchCollection('[variableThatCausesUpdate, someOtherVariable]', function(newValue) {
// We want to ensure that our asyncData is up to date,
// since we will be using it in our action
asyncDataService.fetchAsyncData().then(function(asyncData) {
// Firing with the "stale" promise since it occurs before update
someActionRequiringOurAsyncData(asyncData);
})
});
});
首先，不要在Angular中使用
setTimeout$timeout