angularJS: $location 服务
记录下今天的学习笔记:
$location服务:
- 解析地址栏的URL,让用户可以访问应用当前路径所对应的路由。
- 可修改路径、处理各种形式导航。
$location服务对javascript中的window.location对象的API进行了更优雅的封装,并且和angularJS集成在一起。
使用$location服务的最佳场景是:当应用需要在内部进行跳转时候。如:用户注册、修改、或登录后进行的跳转。
$location服务并不刷新整个页面。刷新整个页面使用:$window.location对象(window.location的一个接口)
1. path() - 获取页面当前路径:
$location.path(); //返回当前路径
$location.path('/'); //修改路径为'/'路由,并跳转
path()方法直接和H5的历史API进行交互,所以用户可通过点击后退按钮退回到上个页面。
2. replace() - 禁止用户跳转后点击后退按钮。(如用户登录后)
$location.path('/home');
$location.replace();
或者:
$location.path('/home').replace();
3. absUrl() - 获取编码后的完整URL
$location.absUrl();
4. hash() - 获取URL中的hash片段
$location.hash(); // 返回当前的hash片段
5. host() - 获取URL中的主机
$location.host();
6. port() - 获取URL中的端口号
$location.port();
7. protocol() - 获取URL中的协议
$location.protocol();
8. search() - 获取URL中的查询串
$location.search();
这个方法可传入新的查询参数,用来修改URL中的查询串部分:
//用对象设置查询:
$location.search({name: 'Ari', username: 'auser'});
//用字符串设置查询:
$location.search('name=Air&username=auser');
search方法可接收两个可选参数:
- search(可选,字符串或对象) - 代表新的查询参数。hash对象的值可以是数组
- paramValue(可选,字符串) - 如果search参数的类型是字符串,那么paramValue会作为该参数的值覆盖URL当中对应的值。如果paramValue的值是null,对应的参数会被移除。
9. url() - 获取当前的URL:
$location.url();
调用url()方法时如果传了参数,会设置并修改当前的URL,同时修改URL中的路径、查询串和hash,并返回$location。
//设置新的URL
$location.url('/home?name=Ari#hashthing');
方法可接收两个参数:
url(可选,字符串) - 新的URL的基础的前缀。
replace(可选,字符串) - 想要修改成的路径。