如何在angular.js中使用$ http创建同步?

时间:2014-10-11 18:51:46

标签: javascript ajax angularjs

我是java脚本的初学者,并且不了解如何使用$ http对象创建同步Ajax调用如果有人有想法请指导我,我如何通过$ http同步进行Ajax调用

我的代码如下 -

var AjaxModule = angular.module('AjaxModule',[]);
AjaxModule.controller('AjaxController',function($scope,$http){
    var path ="http://localhost/services_ajax/";
    var serviceName = 'customers'; 
    var response = $http.get(path+serviceName);
    response.success(function(data){
        $scope.list = data;
    });
});

2 个答案:

答案 0 :(得分:2)

您无法使用$ http服务发出同步请求。它被硬编码为服务代码中的异步。但是,您可以创建自己的同步服务。

var myApp = angular.module('myApp', []);

myApp.service('synchronousService', [function () {
    var serviceMethod = function (url) {
        var request;
        if (window.XMLHttpRequest) {
            request = new XMLHttpRequest();
        } else if (window.ActiveXObject) {
            request = new ActiveXObject("Microsoft.XMLHTTP");
        } else {
            throw new Error("Your browser don't support XMLHttpRequest");
        }

        request.open('GET', url, false);
        request.send(null);

        if (request.status === 200) {
            return request.responseText;
        }
    };
    return serviceMethod;
}]);

myApp.controller('AppCtrl', function ($scope, synchronousService) {
    var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20where%20symbol%20in%20%28%22AAPL%22%29&env=store://datatables.org/alltableswithkeys";
    alert(synchronousService(url));
});

这是工作jsfiddle: http://jsfiddle.net/zono/uL0e1j3e/18/

只是说同步请求是一个非常糟糕的主意。

答案 1 :(得分:1)

你可以使用角度的承诺概念。 承诺提供同步设施。 我通过演示示例

向您演示

var app = angular.module(" myApp",[]);

app.controller(" CTRL",函数($范围,$ Q,$超时){

var task1 = $q.defer();
task1.promice.then(function(value){
       // write a code here for your task 1 success
} ,function(value){
       // write a code here for your task 1 error
});

var task2 = $q.defer();
task2.promice.then(function(value){
      // write a code here for your task 2 success
} ,function(value){
     // write a code here for your task 2 error
});

$q.all([task1.prpmice,task2.promice])
     .then(function(){
             // write a code which is executed when both the task are completed
    } ,function(){
            // write a code which is executed when some of the task are rejected
});

}

上面的代码将帮助您理解角度

的promice概念