在學習AngularJS的過程中感覺到，通過一次性從服務端的數據庫獲取信息，在前端進行分頁，這是一種比較可取的方式。因為它節省了前后端的通信負載，把更多的顯示方面的任務交給前端處理。
此內容分為兩個部分，第一部分給大家簡單介紹一下AngularJS的內建服務$location及其功能；第二部分通過一個比較完整的綜合實例來實現分頁顯示數據庫信息的效果。
在做angularJS的Mutilpe View & Route 的工作時，感覺到應該更加深入的了解一下angularJS的內建的服務&location，因為這個內建的服務于瀏覽器的URL的操作息息相關，感覺如果處理好了這個服務，那么對日后進行頁面的翻頁處理會很有幫助。
下面就是我的一些小小的實驗，以及一些心得體會，都是用白話文寫的，可能不是那么的專業，但是希望對大家理解angularJS的一些概念有所幫助。
這個&location是作為一個服務（service），以依賴注入（dependency injection）的方式作為控制器的返回函數的參數使用。下面就以一個實例來解釋這個服務的使用。
Section 1：獲取URL信息
&location提供了一些個getter和setter方法，比如absUrl，path，protocol，host，port。具體的解釋就是，這些都是&location提供的關于鏈接地址函數的函數名，如果這些函數在使用時不傳入任何參數，則表示獲取當前的url信息；如果傳入一些參數，則表示設置當前瀏覽器里的url信息。
實例 1
<!DOCTYPE html><html ng-app="LocationApp"><head lang="en"> <meta charset="UTF-8"> <title></title></head><body ng-controller="LocationController"><p>absUrl----------{{absUrl}}</p><p>path------------{{path}}</p><p>protocol--------{{protocol}}</p><p>host------------{{host}}</p><p>port------------{{port}}</p><script src="angular.js"></script><script> var LocationApp = angular.module('LocationApp', []); LocationApp.controller('LocationController', ['$scope', '$location', function ($scope, $location) { $scope.absUrl = $location.absUrl(); $scope.path = $location.path(); $scope.protocol = $location.protocol(); $scope.host = $location.host(); $scope.port = $location.port(); }]);</script></body></html>
從截圖能夠明顯的看出，$location這個服務提供的getter方法可以很方便的獲取l瀏覽器當前的url信息。
細心的同學可能已經看到了，這個path怎么沒有值呢？
這是因為鏈接地址里并沒有path路徑信息。如果我們通過path（）方法手動的設置一個path信息，然后再刷新瀏覽器（刷新時瀏覽器的url地址是你修改過的信息，是不會變的），就會看到path的信息了。有圖有真相！
實例 2
$location.path('detail');
$scope.path = $location.path();
從上面的小的修改中看到，我修改了代碼，首先通過setter方法在$location這個內建的服務（其實質就是一個對象，里面有很多關于url信息的屬性）里修改了它的path屬性的值。
然后再通過getter方法獲取到這個新的值。
又因為location這個服務于瀏覽器地址欄的URL信息是雙向綁定的（這是angularJS最精妙的地方），所以無論 location對象的屬性還是瀏覽器地址欄，只要有一方的url信息改變，那么另一方也會跟著改變。所以看到截圖中瀏覽器的地址欄中也多了一個detail這樣的path信息，這個信息是之前通過代碼設置的。
關于AngularJS實現分頁顯示功能在下篇文章中為大家進行介紹，希望大家不要錯過。
新聞熱點
疑難解答
