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 相关文章推荐
如何取得中文输入的真实长度?
Jun 24 Javascript
自制基于jQuery的智能提示插件一枚
Feb 18 Javascript
在Python中使用glob模块查找文件路径的方法
Jun 17 Javascript
Jquery常用的方法汇总
Sep 01 Javascript
分享Javascript实用方法二
Dec 13 Javascript
酷! 不同风格页面布局幻灯片特效js实现
Feb 19 Javascript
jQuery实现字符串全部替换的方法
Dec 12 Javascript
Bootstrap3 多个模态对话框无法显示的解决方案
Feb 23 Javascript
HTML5+Canvas调用手机拍照功能实现图片上传(下)
Apr 21 Javascript
echarts大屏字体自适应的方法步骤
Jul 12 Javascript
js消除图片小游戏代码
Dec 11 Javascript
JS动态显示倒计时效果
Dec 12 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 静态化实现代码
2009/03/20 PHP
wamp下修改mysql访问密码的解决方法
2013/05/07 PHP
探讨:parse url解析URL,返回其组成部分
2013/06/14 PHP
在PHP中使用X-SendFile头让文件下载更快
2014/06/01 PHP
PHP CURL 内存泄露问题解决方法
2015/02/12 PHP
php开发工具有哪五款
2015/11/09 PHP
IE中jscript/javascript的条件编译
2006/09/07 Javascript
JavaScript与Image加载事件(onload)、加载状态(complete)
2011/02/14 Javascript
鼠标放在图片上显示大图的JS代码
2013/03/26 Javascript
js用正则表达式来验证表单(比较齐全的资源)
2013/11/17 Javascript
jquery的trigger和triggerHandler的区别示例介绍
2014/04/20 Javascript
超级简单的jquery操作表格方法
2014/12/15 Javascript
javascript实现图片自动和可控的轮播切换特效
2015/04/13 Javascript
[原创]JQuery 在表单提交之前修改 提交的值
2016/04/14 Javascript
AngularJS基础 ng-submit 指令简单示例
2016/08/03 Javascript
JavaScript实现解析INI文件内容的方法
2016/11/17 Javascript
a标签置灰不可点击的实现方法
2017/02/06 Javascript
微信小程序事件对象中e.target和e.currentTarget的区别详解
2019/05/08 Javascript
react antd表格中渲染一张或多张图片的实例
2020/10/28 Javascript
[13:21]DOTA2国际邀请赛采访专栏:RSnake战队国士无双,Fnatic.Fly
2013/08/06 DOTA
浅谈Python实现Apriori算法介绍
2017/12/20 Python
Python数据分析之双色球统计单个红和蓝球哪个比例高的方法
2018/02/03 Python
selenium+python 去除启动的黑色cmd窗口方法
2018/05/22 Python
Pytorch Tensor的索引与切片例子
2019/08/18 Python
Python对列表的操作知识点详解
2019/08/20 Python
Python将列表中的元素转化为数字并排序的示例
2019/12/25 Python
东南亚冒险旅行与活动:Adventoro
2019/10/16 全球购物
Traffic People官网:女式花裙、上衣和连身裤
2020/10/12 全球购物
搬家公司的创业计划书
2014/01/01 职场文书
竞选大队长演讲稿
2014/04/29 职场文书
简单租房协议书(范本)
2014/10/13 职场文书
红歌会主持词
2015/07/02 职场文书
2016年五一国际劳动节活动总结
2016/04/06 职场文书
MySQL之DML语言
2021/04/05 MySQL
Python进度条的使用
2021/05/17 Python
详解PHP Swoole与TCP三次握手
2021/05/27 PHP