16 自定义服务

秒速五厘米 2022-05-26 00:59 190阅读 0赞

# 自定义服务 #

angularjs 中可通过三种（`$provider`,`$factory`,`$service`）方式自定义服务，以下是不同的实现形式：

// 定义module , module中注入$provide
    var starterApp = angular.module('starter.controllers', [],function($provide){ 
    // 第一种方式：使用provide的provider自定义服务
    $provide.provider('getUserInfoService', function(){ 
    this.$get = function(){ 
    var userInfo = [{
    'userName':'张三0',
    'userNick':'小花0',
    'age':25
    },{
    'userName':'张三1',
    'userNick':'小花1',
    'age':26
    }];
    return userInfo;
    }
    });
    $provide.factory('',function(){ });
    $provide.service('',function(){ });
    });
    
    //第二种方式 (module 的 config 方法中注入 $provide)
    starterApp.config(['$provide',function($provide) { 
    // 使用provide的provider自定义服务(返回对象，字符串，服务,且必须通过$get方法返回)
    $provide.provider('getUserAddressService', function(){ 
    var _userAddress = '';
    var service = {};
    this.$get = function(){ 
    service.setAddress = function (userAddress){ 
    _userAddress = userAddress;
    }
    service.getAddress = function (){ 
    return _userAddress;
    }
    return service;
    }
    });
    // 使用provide的factory自定义服务（返回对象，服务，字符串）
    $provide.factory('serviceName1', ['$http', function($http){ 
    var service = {};
    service.getName = function (){ 
    return '张三';
    }
    return service;
    }]);
    // 使用provide的service自定义服务(返回对象，服务)
    $provide.service('serviceName2', ['$http', function($http){ 
    // return { 
    // 'name':'aa'
    // };
    //可直接通过this定义方法
    this.getName = function (){ 
    return '张三';
    }
    }])
    }]);
    
    //第三种方式（module 的 provider、service、factory 方法 推荐第三种）
    starterApp.provider('serviceName3',function(){ 
    this.$get = function (){ 
    return '直接通过module的provider方法定义服务';
    }
    });
    starterApp.factory('serviceName4',function(){ 
    return '直接通过module的factory方法定义服务';
    });
    starterApp.service('serviceName5',function(){ 
    return {
    'message':'直接通过module的service方法定义服务'
    }
    });