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 HTML5 音乐天气播放器(Ajax获取天气信息)
May 26 Javascript
JavaScript实现页面实时显示当前时间的简单实例
Jul 20 Javascript
浅谈JavaScript中定义变量时有无var声明的区别
Aug 18 Javascript
Javascript 跨域知识详细介绍
Oct 30 Javascript
利用n工具轻松管理Node.js的版本
Apr 21 Javascript
uploader秒传图片到服务器完整代码
Apr 22 Javascript
vue.js2.0点击获取自己的属性和jquery方法
Feb 23 jQuery
JS实现的排列组合算法示例
Jul 16 Javascript
webpack的pitching loader详解
Sep 23 Javascript
JS图片预加载三种实现方法解析
May 08 Javascript
OpenLayers3实现测量功能
Sep 25 Javascript
vue响应式原理与双向数据的深入解析
Jun 04 Vue.js
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
第八节 访问方式 [8]
2006/10/09 PHP
php读取javascript设置的cookies的代码
2010/04/12 PHP
PHP常用的文件操作函数经典收藏
2013/04/02 PHP
PHP实现微信退款的方法示例
2019/03/26 PHP
javascript xml为数据源的下拉框控件
2009/07/07 Javascript
让mayfish支持mysqli数据库驱动的实现方法
2010/05/22 Javascript
js对象内部访问this修饰的成员函数示例
2014/04/27 Javascript
js防止页面被iframe调用的方法
2014/10/30 Javascript
探讨JavaScript标签位置的存放与功能有无关系
2016/01/15 Javascript
如何解决手机浏览器页面点击不跳转浏览器双击放大网页
2016/07/01 Javascript
深入解析桶排序算法及Node.js上JavaScript的代码实现
2016/07/06 Javascript
jquery html5 视频播放控制代码
2016/11/06 Javascript
微信小程序自定义导航隐藏和显示功能
2017/06/13 Javascript
JavaScript输入框字数实时统计更新
2017/06/17 Javascript
微信小程序页面间值传递的两种方法
2018/11/26 Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
2019/09/12 Javascript
JS加载解析Markdown文档过程详解
2020/05/19 Javascript
js+for循环实现字符串自动转义的代码(把后面的字符替换前面的字符)
2020/12/24 Javascript
[01:38]DOTA2第二届亚洲邀请赛中国区预选赛出线战队晋级之路
2017/01/17 DOTA
布同 Python中文问题解决方法(总结了多位前人经验,初学者必看)
2011/03/13 Python
python文件与目录操作实例详解
2016/02/22 Python
python的re正则表达式实例代码
2018/01/24 Python
Python实现读取字符串按列分配后按行输出示例
2018/04/17 Python
mac下如何将python2.7改为python3
2018/07/13 Python
python-django中的APPEND_SLASH实现方法
2019/06/21 Python
Python 模拟生成动态产生验证码图片的方法
2020/02/01 Python
Python使用cn2an实现中文数字与阿拉伯数字的相互转换
2021/03/02 Python
CSS3弹性盒模型开发笔记(二)
2016/04/26 HTML / CSS
HTML5中图片之间的缝隙完美解决方法
2017/07/07 HTML / CSS
大整数数相乘的问题
2012/07/22 面试题
师德师风个人反思
2014/04/28 职场文书
网络编辑求职信
2014/04/30 职场文书
禁止高声喧哗的标语
2014/06/11 职场文书
2015年转正工作总结范文
2015/04/02 职场文书
安全教育片观后感
2015/06/17 职场文书
优秀共产党员事迹材料2016
2016/02/29 职场文书