angularjs封装$http为factory的方法


Posted in Javascript onMay 18, 2017

angularjs有本身封装的ajax服务$http,因为用惯了jQuery的ajax,所以,自己封装了一下angularjs的$http,代码如下

app.factory('dataFactory', function ($http, $q){ 
  var factory = {}; 
  factory.getlist = function(endpoint, method, headers, params) { 
    var defer = $q.defer(); 
    if (method == 'GET') { 
      $http({ 
        url: endpoint, 
        method: "GET", 
        headers: headers, 
        params: params, 
      }).success(function (data) { 
        defer.resolve(data); 
      }). 
      error(function (data, status, headers, config) { 
        // defer.resolve(data); 
        defer.reject(data); 
      }); 
    } else { 
      $http({ 
        url: endpoint, 
        method: method, 
        headers: headers, 
        data: params, 
      }).success(function (data) { 
        defer.resolve(data); 
      }). 
      error(function (data, status, headers, config) { 
        // defer.resolve(data); 
        defer.reject(data); 
      }); 
    } 
    return defer.promise; 
    }; 
    return factory; 
});

在controller中引入dataFactory和$http即可使用更方便的调用ajax,一般情况下headers为

headers = {'Content-Type': 'application/json'};

params为一个json字符串

然后调用

dataFactory.getlist("/api/checkDuplicate", 'GET', headers, params).then(function(data) { 
//success函数 
},function(data){ 
//error函数 
})

但是其中又一次在项目中,后台框架使用的是Struts框架,在一个Python中使用的很好的dataFactory,在这里的后台取不到数,最后发现是应为header设置不对,而且params的格式也不正确,可以把header修改为

headers = {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'};

上面dataFactory中else添加转换params代码:

var param = function(obj) { 
        var query = '', name, value, fullSubName, subName, subValue, innerObj, i; 
 
        for(name in obj) { 
         value = obj[name]; 
 
         if(value instanceof Array) { 
          for(i=0; i<value.length; ++i) { 
           subValue = value[i]; 
           fullSubName = name + '[' + i + ']'; 
           innerObj = {}; 
           innerObj[fullSubName] = subValue; 
           query += param(innerObj) + '&'; 
          } 
         } 
         else if(value instanceof Object) { 
          for(subName in value) { 
           subValue = value[subName]; 
           fullSubName = name + '[' + subName + ']'; 
           innerObj = {}; 
           innerObj[fullSubName] = subValue; 
           query += param(innerObj) + '&'; 
          } 
         } 
         else if(value !== undefined && value !== null) 
          query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&'; 
        } 
        return query.length ? query.substr(0, query.length - 1) : query; 
        }; 
      $http({ 
        url: endpoint, 
        method: method, 
        headers: headers, 
        data: param(params), 
      }).success(function (data) { 
        defer.resolve(data); 
      }). 
      error(function (data, status, headers, config) { 
        // defer.resolve(data); 
        defer.reject(data); 
      });

只是个人觉得这个方式比较方便,记录下来,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js中对象的声明方式以及数组的一些用法示例
Dec 11 Javascript
js中判断对象是否为空的三种实现方法
Dec 23 Javascript
jquery实现预览提交的表单代码分享
May 21 Javascript
一行命令搞定node.js 版本升级
Jul 20 Javascript
高效的jquery数字滚动特效
Dec 17 Javascript
connection reset by peer问题总结及解决方案
Oct 21 Javascript
jquery获取table指定行和列的数据方法(当前选中行、列)
Nov 07 Javascript
Bootstrap源码解读网格系统(3)
Dec 22 Javascript
js实现适配不同的屏幕大小
Apr 10 Javascript
Node.JS中快速扫描端口并发现局域网内的Web服务器地址(80)
Sep 18 Javascript
微信小程序实现tab和swiper切换结合效果
Jul 17 Javascript
Vue使用枚举类型实现HTML下拉框步骤详解
Feb 05 Javascript
bootstrap表单示例代码分享
May 18 #Javascript
angularJS 发起$http.post和$http.get请求的实现方法
May 18 #Javascript
微信小程序 wx.request方法的异步封装实例详解
May 18 #Javascript
微信小程序中input标签详解及简单实例
May 18 #Javascript
JavaScript运动框架 链式运动到完美运动(五)
May 18 #Javascript
JavaScript运动框架 多值运动(四)
May 18 #Javascript
微信小程序页面开发注意事项整理
May 18 #Javascript
You might like
php empty()与isset()区别的详细介绍
2013/06/17 PHP
phpmailer发送gmail邮件实例详解
2013/06/24 PHP
php实现比较全的数据库操作类
2015/06/18 PHP
共享自己写一个框架DreamScript
2007/01/20 Javascript
Extjs中使用extend(js继承) 的代码
2012/03/15 Javascript
S2SH整合JQuery+Ajax实现登录验证功能实现代码
2013/01/30 Javascript
jquery创建一个ajax关键词数据搜索实现思路
2013/02/26 Javascript
js日期时间补零的小例子
2013/03/05 Javascript
jquery实现页面虚拟键盘特效
2015/08/08 Javascript
浅谈js中字符和数组一些基本算法题
2016/08/15 Javascript
JavaScript运动框架 解决速度正负取整问题(一)
2017/05/17 Javascript
在NPM发布自己造的轮子的方法步骤
2019/03/09 Javascript
Vue常用的全选/反选的示例代码
2020/02/19 Javascript
基于javascript的无缝滚动动画1
2020/08/07 Javascript
python处理按钮消息的实例详解
2017/07/11 Python
基于python socketserver框架全面解析
2017/09/21 Python
对python numpy数组中冒号的使用方法详解
2018/04/17 Python
将Django项目部署到CentOs服务器中
2018/10/18 Python
Python批量查询关键词微信指数实例方法
2019/06/27 Python
浅谈pytorch grad_fn以及权重梯度不更新的问题
2019/08/20 Python
利用pandas将非数值数据转换成数值的方式
2019/12/18 Python
pytorch 图像预处理之减去均值,除以方差的实例
2020/01/02 Python
Python数据可视化处理库PyEcharts柱状图,饼图,线性图,词云图常用实例详解
2020/02/10 Python
基于Python获取docx/doc文件内容代码解析
2020/02/17 Python
利用PyTorch实现VGG16教程
2020/06/24 Python
python报错: 'list' object has no attribute 'shape'的解决
2020/07/15 Python
以下的初始化有什么区别
2013/12/16 面试题
客服实习的个人自我鉴定
2013/10/20 职场文书
管理心得体会
2013/12/28 职场文书
《两只鸟蛋》教学反思
2014/02/10 职场文书
婚前协议书怎么写
2014/04/15 职场文书
小学语文教学经验交流材料
2014/06/02 职场文书
2014年公务员个人工作总结
2014/11/22 职场文书
材料员岗位职责
2015/02/10 职场文书
公司开会通知
2015/04/20 职场文书
15个值得收藏的JavaScript函数
2021/09/15 Javascript