angularjs自定义数据获取服务

Posted 2020-08-22 刘伟9413

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了angularjs自定义数据获取服务相关的知识，希望对你有一定的参考价值。

自定义数据获取服务文件：server-http.js

var m1 = angular.module(‘module1‘,[]);
m1.config([‘$httpProvider‘,
    function ($httpProvider) {
        $httpProvider.defaults.withCredentials = true; //设定Cookie支持
        // Use x-www-form-urlencoded Content-Type
        $httpProvider.defaults.headers.post[‘Content-Type‘] = ‘application/x-www-form-urlencoded‘;
        $httpProvider.defaults.headers.put[‘Content-Type‘] = ‘application/x-www-form-urlencoded‘;
        $httpProvider.defaults.headers.post[‘Accept‘] = ‘application/json‘;
        $httpProvider.defaults.headers.put[‘Accept‘] = ‘application/json‘;
        // Override $http service‘s default transformRequest
        $httpProvider.defaults.transformRequest = [function(data)
        {
            /**
             * The workhorse; converts an object to x-www-form-urlencoded serialization.
             * @param {Object} obj
             * @return {String}
             */
            var param = function(obj)
            {
                var query = ‘‘;
                var name, value, fullSubName, subName, subValue, innerObj, i;
                for(name in obj)
                {
                    value = obj[name];
                    if(value instanceof Array)
                    {
                        //  console.log("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)
                    {
                        // console.log("object");
                        for(subName in value)
                        {
                            subValue = value[subName];
                            if(subValue != null){
                                // fullSubName = name + ‘[‘ + subName + ‘]‘;
                                //user.userName = hmm & user.userPassword = 111
                                fullSubName = name + ‘.‘ + subName;
                                // fullSubName =  subName;
                                innerObj = {};
                                innerObj[fullSubName] = subValue;
                                query += param(innerObj) + ‘&‘;
                            }
                        }
                    }
                    else if(value !== undefined ) //&& value !== null
                    {
                        // console.log("undefined");
                        query += encodeURIComponent(name) + ‘=‘ + encodeURIComponent(value) + ‘&‘;
                    }
                }
                return query.length ? query.substr(0, query.length - 1) : query;
            };
            return angular.isObject(data) && String(data) !== ‘[object File]‘ ? param(data) : data;
        }]
        $httpProvider.defaults.useXDomain = true;
    }
]);

m1.factory(‘db‘, [‘$http‘, ‘$q‘, function($http, $q) {
    return {
        getData: function(url, parama) {
            var deferred = $q.defer();
            $http.post(url, parama)
                .success(function(response, status, headers, config) {
                    deferred.resolve(response);
                }).error(function(response, status, headers, config){
                var errorObj = {
                    response: response,
                    status: status,
                    headers: headers,
                    config: config
                };
                deferred.reject(errorObj);
            });
            return deferred.promise;
        }
    }
}]);

自定义数据获取服务html文件

<!DOCTYPE HTML>
<html ng-app="myApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="angular.min.js"></script>
<script src="server-http.js"></script>
<script>
var m2 = angular.module(‘myApp‘,[‘module1‘]);
m2.controller(‘Aaa‘,[‘$scope‘,‘db‘,function($scope,db){
    var url = ‘http://60.205.115.173:8081/yitaireport/report/getTitleDetail‘;
    var parama = {
        trialId:105,
        cityId:530100,
        areaId:530181,
        roleType:10,
        templateType:20
    };
    db.getData(url, parama).then(function(resData) {
        console.log( resData );
    }, function(error) {

    })
}]);
</script>
</head>

<body>
<div ng-controller="Aaa">
</div>
</body>
</html>

日常代码记录下来，方便日后引用。

以上是关于angularjs自定义数据获取服务的主要内容，如果未能解决你的问题，请参考以下文章

PagerSlidingTabStrip- 使用列表片段的自定义视图显示突然的行为

AngularJS 自定义服务指令

AngularJS服务总结

angularJS自定义那些事

深究AngularJS——自定义服务详解(factoryserviceprovider)

angularJS自定义过滤器服务和指令