什么是异步执行?
各语句执行结束的顺序与语句执行开始的顺序并不一定相同。在angularJS中,可以理解成界面可以操作,但是有一个程序在后面默默的执行,执行成功后可以控制界面显示结果。
AngularJS如何实现异步
在angularJS的控制器中定义的函数、语句默认都是同步执行,当需要使用异步时,可以通过$q实现,根据有无后台数据请求,这里分两种实现方式:
第一种实现方式,无有后台请求
//同步
$scope.init = function(){
$scope.num = 0;
while($scope.num<20000){
console.log("$scope.num",$scope.num);
$scope.num++;
}
}
//$scope.init();
//异步
$scope.init_q = function(){
$scope.num = 0;
return $q(function (resolve, reject) {
$timeout(function () {
try{
while($scope.num<20000){
console.log("$scope.num",$scope.num);
$scope.num++;
}
resolve("resolve");
}catch (e){
reject("reject");
}
},1000)
});
}
/* $scope.init_q().then(function(data){
console.log("执行了resolve方法,收到数据:",data);
},function(data){
console.log("执行了reject方法,收到数据:",data);
});*/
第二种实现方式,有后台请求
//定义一个异步,第二种
$scope.init_q_2 = function(){
//通知这是一个延时请求
var deferred = $q.defer();
//获取请求数据
$scope.curBusiUser = localStorage.getItem('curBusiUser');
var config = {
responseType: 'json',
cache: false
};
var param = {
huhaos: $scope.curBusiUser
};
$hyHttp.post('wxgetCustomerList', config, param).success(function (bindingResult) {
try{
deferred.resolve(bindingResult);
}catch (e){
deferred.reject("reject");
}
}).error(function () {
deferred.reject("reject");
});
return deferred.promise;
}
//执行异步
$scope.init_q_2().then(function(data){
//---------------
//业务处理
//---------------
$scope.num = data;
console.log("执行了resolve方法,收到数据:",data);
},function(data){
//---------------
//业务处理
//---------------
console.log("执行了reject方法,收到数据:",data);
});
获取数据后执行异步请求
//定义一个异步,第二种
$scope.init_q_2 = function(){
//通知这是一个延时请求
var deferred = $q.defer();
if ( $scope.selectDay) {
$scope.currentDateTT = $scope.updateTime.substring(0, 4) + '-' +$scope.updateTime.substring(5, 7) + '-' + $scope.updateTime.substring(8, 10) ;
$scope.tjzq="D";
} else if ( $scope.selectMonth) {
$scope.currentDateTT = $scope.updateTime.substring(0, 4) + '-' + $scope.updateTime.substring(5, 7) ;
$scope.tjzq="M";
} else {
$scope.tjzq="Y";
$scope.currentDateTT = $scope.updateTime.substring(0, 4) ;
}
var config = {
responseType: 'json',
cache: false
};
var param = {
jldbh: $rootScope.jldbhQ,
tjzq:$scope.tjzq,
sjsj: $scope.currentDateTT
};
$hyHttp.post('appGetjzdInfor', config, param).success(function (bindingResult) {
try{
deferred.resolve(bindingResult);
}catch (e){
deferred.reject("reject");
}
}).error(function () {
deferred.reject("reject");
});
return deferred.promise;
};
//执行异步
$scope.init_q_2_success = function(data){
//---------------
//业务处理
//---------------
console.log(data);
$scope.userjzdInfor = JSON.parse(data.content);
console.info('22223',$scope.userjzdInfor);
console.log("执行了resolve方法,收到数据:",data);
}
$scope.init_q_2_fail= function(data){
//---------------
//业务处理
//---------------
console.log("执行了reject方法,收到数据:",data);
}
//执行异步
$scope.init_q_2().then(function(data){
$scope.init_q_2_success(data);
},function(data){
$scope.init_q_2_fail(data);
});