I have the following code in my javascript controller. The functions work when called independently and asynchronously from the view. However I want to call them synchronously on page load as the returning value from the first function is used in the call for the second function
$scope.function1= function () {
$http({
url: '/Class/method1/',
method: 'GET'
}).success(function (data) {
$scope.mygrid= data.data;
$scope.myvalue= $scope.mygrid[0];
});
};
$scope.function2= function () {
$http({
url: '/class/method2/',
method: 'POST',
params: { myValue: $scope.myvalue }
}).success(function (data) {
$scope.myValue2 = data.data;
});
};
var initialize = function () {
var defer = $q.defer();
defer.promise
.then(function() {
$scope.function1();
})
.then(function() {
$scope.function2();
})
defer.resolve();
};
initialize();
On the second call $scope.myvalue is null. Data has been returned from function one so the only thing I can think of is that function2 is being called too early. Any pointers? :-)
The promise in initialize
runs synchronously. While $http
requests don't. This results in calling $scope.function2
without waiting for a promise in $scope.function1
to resolve.
It should be
$scope.function1= function () {
return $http...
};
$scope.function2= function () {
return $http...
};
In this case deferred promise is antipattern , and initialize
should be as concise as that:
var initialize = function () {
return $scope.function1().then(function() {
return $scope.function2();
})
};
$http({
url: 'url',
method: 'GET'
})
this also is kind of one promise so it will run async.
$scope.function1= function () {//3rd step
$http({
url: '/Class/method1/',
method: 'GET'
}).success(function (data) {
$scope.mygrid= data.data; //this run as asyn after response recived
$scope.myvalue= $scope.mygrid[0];
});
};
$scope.function2= function () { //5th step
$http({
url: '/class/method2/',
method: 'POST',
params: { myValue: $scope.myvalue }
}).success(function (data) {
$scope.myValue2 = data.data; //this run as asyn after response recived
});
};
var initialize = function () {
var defer = $q.defer();
defer.promise
.then(function() {
$scope.function1(); //2nd step
})
.then(function() {
$scope.function2(); //4th step
})
defer.resolve(); //1st step
};
initialize();
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.