AngularJS 服務(Service)
AngularJS 中你可以創建自己的服務，或使用內建服務。
什麼是服務？
在AngularJS 中，服務是一個函數或對象，可在你的AngularJS 應用中使用。
AngularJS 內建了30 多個服務。
有個$location 服務，它可以返回當前頁面的URL 地址。
實例
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"><p> 當前頁面的url:</p><h3>{{myUrl}}</h3></div><p>該實例使用了內建的$location 服務獲取當前頁面的URL。 </p><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope, $location) { $scope.myUrl = $location.absUrl();});</script></body></html>運行結果：
當前頁面的url:
http://www.runoob.com/try/try.php?filename=try_ng_services
該實例使用了內建的$location 服務獲取當前頁面的URL。
注意： $location 服務是作為一個參數傳遞到controller 中。如果要使用它，需要在controller 中定義。
為什麼使用服務?
$http 是AngularJS 應用中最常用的服務。服務向服務器發送請求，應用響應服務器傳送過來的數據。
AngularJS 會一直監控應用，處理事件變化， AngularJS 使用$location 服務比使用window.location 對象更好。
$http 服務
$http 是AngularJS 應用中最常用的服務。 服務向服務器發送請求，應用響應服務器傳送過來的數據。
實例
使用$http 服務向服務器請求數據:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"> <p>歡迎信息:</p><>{{myWelcome}}<></div><p> $http 服務向服務器請求信息，返回的值放入變量"myWelcome" 中。 </p><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope, $http) { $http.get("welcome.htm").then(function (response) { $scope.myWelcome = response.data; });});</script>運行結果：
歡迎信息:
歡迎訪問
$http 服務向服務器請求信息，返回的值放入變量"myWelcome" 中。
以上是一個非常簡單的$http 服務實例，更多$http 服務應用請查看AngularJS Http 教程。
$timeout 服務
AngularJS $timeout 服務對應了JS window.setTimeout 函數。
實例
兩秒後顯示信息:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"> <p>兩秒後顯示信息:</p><h1>{{myHeader}}</h1></div><p>$timeout 訪問在規定的毫秒數後執行指定函數。 </p><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope, $timeout) { $scope.myHeader = "Hello World!"; $timeout(function () { $scope.myHeader = "How are you today?"; }, 2000);});</script></body></html>運行結果：
兩秒後顯示信息:
How are you today?
$timeout 訪問在規定的毫秒數後執行指定函數。
$interval 服務
AngularJS $interval 服務對應了JS window.setInterval 函數。
實例
每兩秒顯示信息:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"> <p>現在時間是:</p><h1>{{theTime}}</h1></div><p>$interval 訪問在指定的周期(以毫秒計)來調用函數或計算表達式。 </p><script>var app = angular.module('myApp', []);app.controller('myCtrl', function($scope, $interval) { $scope.theTime = new Date().toLocaleTimeString(); $interval(function () { $scope.theTime = new Date().toLocaleTimeString(); }, 1000);});</script></body></html>運行效果：
現在時間是:
下午3:41:09
$interval 訪問在指定的周期(以毫秒計)來調用函數或計
創建自定義服務
你可以創建自定義的訪問，鏈接到你的模塊中：
創建名為hexafy 的訪問:
app.service('hexafy', function() { this.myFunc = function (x) { return x.toString(16); }});要使用自定義的訪問，需要在定義過濾器的時候獨立添加:
實例
使用自定義的的服務hexafy 將一個數字轉換為16進制數:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"><p>255 的16進制是:</p><h1>{{hex}}</h1></div><p>自定義服務，用於轉換16進制數：</p><script>var app = angular.module('myApp', []);app.service('hexafy', function() {this.myFunc = function (x) { return x.toString(16); }});app.controller('myCtrl', function($scope, hexafy) { $scope.hex = hexafy.myFunc(255);});</script></body></html>運行結果：
255 的16 進制是：
ff
自定義服務,用於轉換16進制數：
過濾器中，使用自定義服務
當你創建了自定義服務，並連接到你的應用上後，你可以在控制器，指令，過濾器或其他服務中使用它。
在過濾器myFormat 中使用服務hexafy:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp">在過濾器中使用服務:<h1>{{255 | myFormat}}</h1></div><script>var app = angular.module('myApp', []);app.service('hexafy', function() {this.myFunc = function (x) { return x.toString(16); }});app.filter('myFormat',['hexafy', function(hexafy) { return function(x) { return hexafy.myFunc(x); };}]);</script></body></html>運行效果：
在過濾器中使用服務：
ff
在對像數組中獲取值時你可以使用過濾器：
創建服務hexafy:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script></head><body><div ng-app="myApp" ng-controller="myCtrl"><p>在獲取數組[255, 251, 200] 值時使用過濾器:</p><ul> <li ng-repeat="x in counts">{{x | myFormat}}</li></ul><p>過濾器使用服務將10進制轉換為16進制。 </p></div><script>var app = angular.module('myApp', []);app.service('hexafy', function() {this.myFunc = function (x) { return x.toString(16); }});app.filter('myFormat',['hexafy', function(hexafy) { return function(x) { return hexafy.myFunc(x); };}]);app.controller('myCtrl', function($scope) { $scope.counts = [255, 251, 200];});</script></body></html>運行效果：
在獲取數組[255, 251, 200]值時使用過濾器：
過濾器使用服務將10進制轉換為16進制。
以上就是對AngularJS 服務的資料整理，後續繼續補充，有需要的朋友參考下。