AngularJs服务-$location(暴露当前地址栏的URL)

电玩女神 2022-07-12 07:06 147阅读 0赞

<!DOCTYPE html>  
    <html lang="en" ng-app="App">  
        <head>  
            <meta charset="UTF-8">  
            <title>$location服务</title>  
        </head>  
      
        <body>  
            <dl ng-controller="DemoController">  
                <dt>{
       {title}}</dt>  
                <dd>absUrl: {
       {absUrl}}</dd>  
                <dd>url: {
       {url}}</dd>  
                <dd>host: {
       {host}}</dd>  
                <dd>search: {
       {search}}</dd>  
                <dd>hash: {
       {hash}}</dd>  
                <dd>protocol: {
       {protocol}}</dd>  
                <dd>port: {
       {port}}</dd>  
            </dl>  
              
        <script src="../libs/angular.min.js"></script>  
        <script>  
            var App = angular.module('App', []);  
      
            // $location内置服务是angularJS提前封装好的  
            // AngularJS 专门提供了一个帮你获URL地址一个服务  
            App.controller('DemoController', ['$scope', '$location', function($scope, $location) {  
                  
                $scope.title = '学习$location服务';  
      
                $scope.absUrl = $location.absUrl();  
      
                $scope.url = $location.url();  
      
                $scope.host = $location.host();  
      
                $scope.search = $location.search();  
      
                $scope.hash = $location.hash();  
      
                $scope.protocol = $location.protocol();  
      
                $scope.port = $location.port();  
      
            }]);  
              
            for(var key in location) {  
                console.log(key + '=>' + location[key]);  
            }  
        </script>   
        </body>  
    </html>

$location服务解析地址栏中的URL（基于window.location），让你在应用代码中能获取到。改变地址栏中的URL会反应$location服务中，反之亦然。

$location服务:

*  暴露当前地址栏的URL，这样你就能
    
     *  获取并监听URL。
     *  改变URL。
 *  当出现以下情况时同步URL
    
     *  改变地址栏
     *  点击了后退按钮（或者点击了历史链接）
     *  点击了一个链接
 *  一系列方法来获取URL对象的具体内容用（protocol, host, port, path, search, hash）.formatDate