AngularJS内建服务以及自定义服务的用法
在AngularJS中， 服务是一个比较重要的部分，它是一个对象或者是函数，可以在你的AngularJS的应用中使用。接下来介绍几种比较常用的内建服务以及自定义服务的方法。
[内建服务]
（1）location服务
location服务返回当前页面的地址，需要注意的是location服务是作为一个参数传递到 controller 中。如果要使用它，需要在 controller 中定义。
>>>代码部分
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<p> 当前页面的url:</p>
<h3>{{myUrl}}</h3>
</div>
<p>该实例使用了内建的 $location 服务获取当前页面的 URL。</p>
</body>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $location) {
$scope.myUrl = $location.absUrl();
});
</script>
</html>
（2）$http服务
$http服务： 服务向服务器发送请求，应用响应服务器传送过来的数据。
>>>代码部分
1 <div ng-app="myApp" ng-controller="myCtrl"> 2 <p>欢迎信息:</p> 3 <h1>{{myWelcome}}</h1> 4 </div> 5 <p> $http 服务向服务器请求信息，返回的值放入变量 "myWelcome" 中。</p> 6 <script> 7 var app = angular.module('myApp', []); 8 app.controller('myCtrl', function($scope, $http) { 9 $http.get("welcome.htm").then(function (response) { 10 $scope.myWelcome = response.data; 11 }); 12 }); 13 </script>
(3) $timeout服务
AngularJS $timeout 与 JS window.settimeout 函数相对应，实现效果相同
代码如下>>>
1 var app = angular.module('myApp', []); 2 app.controller('myCtrl', function($scope, $timeout) { 3 $scope.myHeader = "Hello World!"; 4 $timeout(function () { 5 $scope.myHeader = "How are you today?"; 6 }, 2000); 7 });
代码所执行的效果是，2s后执行代码。
（4）$interval服务
AngularJS $interval 与 JS window.settimeinterval 函数相对应，实现效果相同
1 var app = angular.module('myApp', []); 2 app.controller('myCtrl', function($scope, $interval) { 3 $scope.theTime = new Date().toLocaleTimeString(); 4 $interval(function () { 5 $scope.theTime = new Date().toLocaleTimeString(); 6 }, 1000); 7 });
【自定义服务】
1、service
1 angular.module("app",[]) 2 .controller("ctrl",function($scope,$hexafy){}） 3 .service('$hexafy', function() { 4 this.$$gongneng = "将转入的数字，转为16进制"; 5 this.myFunc = function (x) { 6 return x.toString(16); 7 } 8 })
2、factory
factory 是一个函数用于返回值,通常我们使用 factory 函数来计算或返回值。(factory使用上，与service差距不大)
1 angular.module("app",[]) 2 .config() 3 .controller("ctrl",function($scope,hexafy){ 4 $scope.gongneng = hexafy.gongneng; 5 $scope.num = hexafy.myFunc(255); 6 }) 7 .factory('hexafy',function(){ 8 var obj = { 9 gongneng : "将转入的数字，转为16进制", 10 myFunc:function(x){ 11 return x.toString(16); 12 } 13 }; 14 return obj; 15 })
3、provider
1、在AngularJS中，Service，factory都是基于provider实现的。
2、在provider中，通过$get()方法提供了factory的写法，用于返回 value/service/factory。；
3、provider是三种自定义服务中，唯一可以写进config配置阶段的一种。
如果服务，必须要在配置阶段执行，那么必须使用provider。否则，一般使用Service或factory
1 .controller("ctrl",function($scope,hexafy){ 2 $scope.gongneng = hexafy.gongneng; 3 $scope.num = hexafy.myFunc(255); 4 }) 5 6 /*定义一个provider服务*/ 7 .provider('hexafy',function(){ 8 //默认使用Service的写法 9 // this.gongneng = "将转入的数字，转为16进制"; 10 this.$get = function(){ 11 var obj = { 12 gongneng : "将转入的数字，转为16进制", 13 myFunc : function(x){ 14 return x.toString(16); 15 } 16 } 17 return obj; 18 } 19 })
