angular使用工厂模式封装公用的 ajax 异步交互

在开发过程中，我们会不可避免的用到 ajax 交互，每一个都需要写 $http,然而写多了会发现，这个维护性不高，而且重复的代码太多，不适合进行快速开发。

　　比如这样：

　　$http({

   　　url:"test.php",

   　　method:"POST",

   　　data:JSON.stringify({name:"tao"}),

   　　headers:{"Content-Type":"application/json"}

　　}).then(function(data){

　　}),function(err){

　　}

当你的项目够大的时候，你会发现，经常这样写会很烦恼，有很多重复的代码。导致项目维护困难，那么用工厂模式是怎么解决的呢？

看代码

app.factory("http",function($http,$q){//注入http服务，$q 的promise；

var obj={};

obj.ajax=function(method,url,data){

  var promise=$q.defer();//取到promise，promise是个比较高级的api，jQuery和各大框架都有，ES5没有这个概念，在ES6当中已经存在了

  $http({

   　　url:url,

   　　method:method,

   　　data:JSON.stringify(data),

   　　headers:{"Content-Type":"application/json"}

　　}).then(function(data){

　　promise.resolve(data)

　　}),function(err){

　　promise.reject(err)

　　}

return promise.promise;

}

return obj;

})

这个工厂服务的代码就完成了。

只要在controller中注入这个服务"http"就可以使用了，

调用代码

.controller('myctrl',['$scope','http',function($scope,http){

　　http.ajax('get','test.php').then(function(data){

　　//data就是获取到的数据了

})

}])

写的不好，请见谅。