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 相关文章推荐
TFDN图片播放器 不错自动播放
Oct 03 Javascript
鼠标移动到图片名上,显示图片的简单实例
Jul 14 Javascript
JavaScript中判断对象类型的几种方法总结
Nov 11 Javascript
jQuery简单实现banner图片切换
Jan 02 Javascript
js与C#进行时间戳转换
Nov 14 Javascript
通过设置CSS中的position属性来固定层的位置
Dec 14 Javascript
jQuery实现的分子运动小球碰撞效果
Jan 27 Javascript
很不错的两款Bootstrap Icon图标选择组件
Jan 28 Javascript
文本框只能输入数字的实现方法(兼容IE火狐)
Jun 25 Javascript
JS基于正则截取替换特定字符之间字符串操作示例
Feb 03 Javascript
package.json文件配置详解
Jun 15 Javascript
Vue利用History记录上一页面的数据方法实例
Nov 02 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 和 COM
2006/10/09 PHP
PHP的中问验证码
2006/11/25 PHP
PHP版 汉字转码的实现详解
2013/06/09 PHP
zf框架的数据库追踪器使用示例
2014/03/13 PHP
dvwa+xampp搭建显示乱码的问题及解决方案
2015/08/23 PHP
PHP中ID设置自增后不连续的原因分析及解决办法
2016/08/21 PHP
PHP严重致命错误处理:php Fatal error: Cannot redeclare class or function
2017/02/05 PHP
php简单中奖算法(实例)
2017/08/15 PHP
搭建PhpStorm+PhpStudy开发环境的超详细教程
2020/09/17 PHP
prototype Element学习笔记(篇二)
2008/10/26 Javascript
Jquery中给animation加更多的运作效果实例
2013/09/05 Javascript
js 调用百度地图api并在地图上进行打点添加标注
2014/05/13 Javascript
使用cluster 将自己的Node服务器扩展为多线程服务器
2014/11/10 Javascript
jQuery中:header选择器用法实例
2014/12/29 Javascript
jquery序列化方法实例分析
2015/06/10 Javascript
JS实现自动变化的导航菜单效果代码
2015/09/09 Javascript
jQuery插件版本冲突的处理方法分析
2017/01/16 Javascript
js css自定义分页效果
2017/02/24 Javascript
vue 运用mock数据的示例代码
2017/11/07 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
2018/06/10 Javascript
Vue+Django项目部署详解
2019/05/30 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
python类:class创建、数据方法属性及访问控制详解
2016/07/25 Python
Python_查看sqlite3表结构,查询语句的示例代码
2019/07/17 Python
使用python无账号无限制获取企查查信息的实例代码
2020/04/17 Python
Python定时任务框架APScheduler原理及常用代码
2020/10/05 Python
详解基于Facecognition+Opencv快速搭建人脸识别及跟踪应用
2021/01/21 Python
很酷的小工具和电子产品商城:GearBest
2016/11/19 全球购物
澳大利亚便宜的家庭购物网站:CrazySales
2018/02/06 全球购物
体育专业个人求职信范文
2013/12/27 职场文书
医药工作岗位求职信分享
2013/12/31 职场文书
小学生元旦广播稿
2014/02/21 职场文书
理财计划书
2014/08/14 职场文书
单位一把手群众路线四风问题整改措施
2014/09/25 职场文书
三年级学生评语大全
2014/12/26 职场文书
创业计划书之美甲店
2019/09/20 职场文书