angularJs使用$q服务进行同步请求数据
一般angularJs中的$http进行的是异步请求操作;在我们想要等待先请求完数据,再进行别的操作,使用这种方式,并不管用,往往请求不到数据。
angularJs“同步”请求的方式的时候,AngularJS提供了一个内置Service $q,它提供了一种承诺/延后(promise/deferred),可以保证我们的调用代码一定能够拿到数据。所以我们用起来可以像同步调用一样,但这最终还是xhr异步请求。
js代码:如请求本地json文件
value与factory服务:
angular.module('init.services',[]) .value('GetInterface',{ queryLinks: function (http,q) { var deferred = q.defer();//声明承诺 http({ method: 'get', url: 'json/interfaces.json' }).then(function success(result) { deferred.resolve(result);//请求成功 }, function error(err) { deferred.reject(err);//请求失败 }); return deferred.promise;//返回承诺 } }) .factory('NewsServices',['$http','$q','GetInterface',function ($http,$q,GetInterface) { return { getInterfaces: function (fn) { var ifs; var promise = GetInterface.queryLinks($http,$q);//获取承诺接口 promise.then(function success(result) {//成功回调 ifs = result.data; // console.log(ifs); fn && fn(ifs);//痛过回调,解决在控制器异步取不到数据; },function error(err) {//错误回调 console.log(err); }); }, setUrl: function () { } }; }]);
控制器:
angular.module('init.controller',['init.services']) .controller('NewsCtrl',['$scope','NewsServices',function ($scope,NewsServices) { NewsServices.setUrl(); }])