angularjs $location

一. 获取url的相关方法:@H_404_2@

以'http://localhost/$location/21.1%20$location.html#/foo?name=bunny#myhash'@H_404_2@这个路径为例:

1.获取当前完整的url路径:

$location.absUrl():
// http://localhost/$location/21.1%20$location.html#/foo?name=bunny#myhash@H_404_2@

*@H_404_2@2. 获取当前url路径(当前url#后面的内容,包括参数和哈希值):

$location.url();
// /foo?name=bunny#myhash@H_404_2@

*@H_404_2@3. 获取当前url的子路径(也就是当前url#后面的内容,不包括参数):

$location.path()
// /foo@H_404_2@

4. 获取当前url的协议(比如http,https)

$location.protocol()
// http@H_404_2@

5. 获取当前url的主机名

$location.host()
// localhost@H_404_2@@H_404_2@

6. 获取当前url的端口

$location.port()
// 80 (这里就是wamp的默认端口号)@H_404_2@

*@H_404_2@7. 获取当前url的哈希值

$location.hash()
// myhash@H_404_2@

*@H_404_2@8. 获取当前url的参数的序列化json对象

$location.search()
// {"name":"bunny"}@H_404_2@@H_404_2@

二. 修改url的相关方法:@H_404_2@

在上面讲到的所有获取url的8个方法,其中*@H_404_2@开头的四个方法,可以传入参数进行修改url,在这种情况下,函数的返回值都是$location本身:

1.修改url的子路径(也就是当前url#后面的内容,不包括参数):

参数格式:字符串

$location.url('/foo2?name=bunny2&age=12#myhash2');
// http://localhost/$location/21.1%20$location.html#/foo2?name=bunny2&age=12#myhash2@H_404_2@@H_404_2@

2. 修改url的子路径部分(也就是当前url#后面的内容,245)">$location.path('/foo2/foo3');
/foo2/foo3@H_404_2@/?name=bunny2&age=12#myhash2@H_404_2@

$location.hash('myhash3');
// http://localhost/$location/21.1%20$location.html#/foo2/foo3/?name=bunny2&age=12#myhash3@H_404_2@@H_404_2@

// 按下后退回到原url:@H_404_2@
// http://localhost/$location/21.1%20$location.html#/foo?name=bunny#myhash
// 再按下前进回到修改后url:
@H_404_2@$location.path('/foo2/foo3').replace();
// 修改第二次后调用replace():@H_404_2@
// http://localhost/$location/21.1%20$location.html#/foo2/foo3?name=bunny2&age=12#myhash2@H_404_2@

// 按下后退,不会回到第二次修改前的url,而是回到第一次修改前的url:@H_404_2@
四.$locationChangeStart和$locationChangeStart事件@H_404_2@

这两个事件分别发生在当url开始发生改变,以及url改变完成.他们都被绑定在$rootScope里面:@H_404_2@

$rootScope.$on('$locationChangeStart',255)">function@H_404_2@(){ console.log(@H_404_2@'开始改变$location') }); $rootScope.$on(@H_404_2@'$locationChangeSuccess',0)">(){ console.log(@H_404_2@'结束改变$location') });@H_404_2@

angularjs $location

猜你在找的Angularjs相关文章