angualarjs $location服务

Posted 2020-08-30 李月云

$location服务

1.功能：获取路径，修改路径，路径跳转，url解析，实质上是对window.location一些功能的封装。

任何你想要改变当前URL的时候，都可以使用$location
当浏览器的URL改变时，不会重新加载整个页面。如果想要重新加载整个页面，需要使用$window.location.href。

2.主要提供以下服务：
暴露浏览器地址栏中的URL，让你可以：监察URL以及改变URL
将URL对象表示为一个方法集 (protocol, host, port, path, search, hash)，当改变地址栏，单击前进/后退或一个历史记录中的链接，打开一个链接时与浏览器同步URL

3.内置方法：

absUrl()  hash()  host()  path()  port()  protocol()  search()  url()

replace():如果被调用，就会用改变后的URL直接替换浏览器中的历史记录，而不是在历史记录中新建一条信息，这样可以阻止后退。

4.内置事件：

$locationChangeStart：在URL改变前发生。这种改变可以通过调用事件的preventDefault方法为阻止。成功时触发$locationChangeSuccess事件。
$locationChangeSuccess：当URL改变后发生。

5.获取url的相关方法

以 ‘http://localhost/$location/21.1%20$location.html#/foo?name=bunny#myhash‘ 这个路径为例
(1)获取当前完整的url路径:
$location.absUrl():
// http://localhost/$location/21.1%20$location.html#/foo?name=bunny#myhash
(2)获取当前url路径(当前url#后面的内容,包括参数和哈希值):
$location.url();
// /foo?name=bunny#myhash
(3)获取当前url的子路径(也就是当前url#后面的内容,不包括参数):
$location.path()
// /foo
(4) 获取当前url的协议(比如http,https)
$location.protocol()
// http
(5) 获取当前url的主机名
$location.host()
// localhost
(6) 获取当前url的端口
$location.port()
// 80 (这里就是wamp的默认端口号)
(7) 获取当前url的哈希值
$location.hash()
// myhash
(8) 获取当前url的参数的序列化json对象
$location.search()
// {"name":"bunny"}