$location

$location服务解析浏览器地址中的url(基于window.location)并且使url在应用程序中可用。将地址栏中的网址的变化反映到$location服务和$location的变化反映到浏览器地址栏。

公开浏览器地址栏中的当前网址,这样就可以:

1.观察和监听网址。

2.改变网址。

与浏览器url同步当用户:

1.改变地址栏的值。

2. 单击“后退”或“前进”按钮(或单击“历史链接”)。

3.点击链接。

表示一组方法(协议、主机、端口、路径、搜索、哈希值)的网址对象。

依赖:$rootElement

方法

absUrl();

只能getter,返回的是完整的url。

url([url],[replace]);

getter/setter,返回当前url路径(当前url#后面的内容,包括参数和哈希值)。

protocol();

只能getter,返回当前url的协议(比如http,https)。

host();

只能getter,返回当前url的主机名。

port();

只能getter,返回当前url的端口号。

path([path]);

getter/setter, 返回当前url的子路径(也就是当前url#后面的内容,不包括参数)。

search(search,[paramValue]);

getter/setter,返回当前url的参数的序列化json对象。

hash([hash]);

getter/setter,返回当前url的哈希值。

replace();

如果被调用,当前$digest过程中所有$location的变化将取代当前的历史记录,而不是增加新的历史记录。

state([state]);

返回当前url的历史状态对象(不包括任何参数)。

调用一个参数并且返回$location时改变历史状态对象。

事件

$locationChangeStart

在url将要被改变时广播。可以使用preventDefault取消默认事件。

参数:

angularEvent:合成事件对象。

newUrl:新的url。

oldUrl:改变前的url。

newState:新的历史状态对象。

oldState:改变前的历史状态对象。

$locationChangeSuccess

在url成功的完成变化后广播。

参数:

angularEvent:合成事件对象。

newUrl:新的url。

oldUrl:改变前的url。

newState:新的历史状态对象。

oldState:改变前的历史状态对象。

使用代码:

  (function(){
angular.module('Demo', [])
.controller('testCtrl',["$location","$scope",testCtrl]);
function testCtrl($location,$scope) {
var url = "http://example.com:8080/#/some/path?foo=bar&baz=xoxo#hashValue";
$location.absUrl();// http://example.com:8080/#/some/path?foo=bar&baz=xoxo#hashValue
$location.url();// some/path?foo=bar&baz=xoxo
$location.protocol();// http
$location.host();// example.com
$location.port();//
$location.path();// /some/path
$location.search();// {foo: 'bar', baz: 'xoxo'}
$location.search('foo', 'yipee');
$location.search();// {foo: 'yipee', baz: 'xoxo'}
$location.hash();// #hashValue
$scope.$on("$locationChangeStart", function () {
//监听url变化,在变化前做想要的处理
});
$scope.$on("$locationChangeSuccess", function () {
//监听url变化,在变化后做想要的处理
});
}
}());

$location在日常开发中是很有用的,特别是$locationChangeStart和$locationChangeSuccess,在做是否登录判断的时候配合拦截器使用,根据拦截器返回的状态,监听url变化并在需要登录的时候退出到登录页面。

$window

一个浏览器窗口对象的引用。它是一个全局对象,在window中是全局可用的,但是它导致一些问题。在Angular中也经常通过$window服务提到它,因此它可以被重写、删除及测试。

$window 等同于 window。

验证代码:

  (function(){
angular.module('Demo', [])
.controller('testCtrl',["$window",testCtrl]);
function testCtrl($window) {
$window === window;
}
}());

$window对象可以用来获取浏览器窗口各项属性(如窗口高度宽度、浏览器版本等等)。

AngularJs $location 和 $window的更多相关文章

  1. window.location.href = window.location.href 跳转无反应 a 超链接 onclick 点击跳转无反应

    错误写法 , 主要是在 href="#"这里 <a href="#" id="send" onclick="return b ...

  2. window.location和window.open

    window.location和window.open的区别 window.location = "http://www.baidu.com" 跳转后有后退功能 window.lo ...

  3. window.location.href = window.location.href window.location.reload()

    w 0-会议预订提交了预订日期,预订成功后默认显示仅显示当前日期的新页面若显示预定日的信息,则可以对预定日存入cookie: http://stackoverflow.com/questions/24 ...

  4. window.location与window.open()的区别

    "top.location.href"是最外层的页面跳转"window.location.href"."location.href"是本页面 ...

  5. window.location和window.location.href和document.location的关系

    1,首先来区分window.location和window.location.href. window.location.href是一个字符串. 而window.location是一个对象,包含属性有 ...

  6. window.location 与window.open区别

    window.location 与window.open区别 1.window.location是window对象的属性,而window.open是window对象的方法   window.locat ...

  7. js 中实现页面跳转的方法(window.location和window.open的区别)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  8. JS中 window.location 与window.location.href的区别

    疑惑:window.location='url'  与window.lcoation.href='url'效果一样,都会跳转到新页面,区别在哪?查得的资料如下: 1:window.location是页 ...

  9. Angular - - $location 和 $window

    $location $location服务解析浏览器地址中的url(基于window.location)并且使url在应用程序中可用.将地址栏中的网址的变化反映到$location服务和$locati ...

随机推荐

  1. Windows下搭建PHP环境:Apache+PHP+MySQL

    本文简单记录一下Windows下搭建PHP环境的过程,一些细节可以参照本文参考资料,此文不再赘述 准备工作: Windows下手工搭建PHP环境需要先下载相应的软件,需要注意的是Apache与PHP的 ...

  2. MVC+EF 理解和实现仓储模式和工作单元模式

    MVC+EF 理解和实现仓储模式和工作单元模式 原文:Understanding Repository and Unit of Work Pattern and Implementing Generi ...

  3. osx开发,skport项目记录

    最近在研究前端框架,学习了一下vue.js,而后找到了element.js,后来又了解到了cooking···前端开发真是三天小更新,一周大变样,一个月天翻地覆啊··· 期间在使用cooking时遇到 ...

  4. pdo知识总结

    PDO 用了这么久了这里抽时间总结下: pdo (php data object) 是php5 新出来的支持 mysql 操作的一个功能.用其可代替mysqli扩展.因为是php自带的.所以我觉得效率 ...

  5. Java网络编程——IP

    类:InetAdrress 该类主要用于表示互联网协议(IP对象)地址,且无构造方法 主要方法: public static InetAddress getLocalHost()-->返回本地主 ...

  6. canvas缓动

    通过不断地将与目标的距离和系数相乘来让物体实现远快近缓的运动. 如图所示可以做出缓动效果,具体代码如下 var canvas = document.getElementById("canva ...

  7. secureCRT背景颜色设置

    1. Options->Global Options->Advanced select 'Monochrome'  click 'Edit' button normal: Backgrou ...

  8. Zookeeper总结

     Zookeeper数据模型 zookeeper有一个层级的命名空间,更像一个分布式的文件系统. 唯一的区别就是命名空间中的每一个节点同它关联. ZNodes zookeeper树上的每一个节点被 ...

  9. 【BZOJ 1911】【APIO 2010】特别行动队

    http://www.lydsy.com/JudgeOnline/problem.php?id=1911 夏令营里斜率优化的例题,我调了一晚上,真是弱啊. 先推公式吧($sum_i$表示$x_1 \d ...

  10. 10G整数文件中寻找中位数或者第K大数

    来源:http://hxraid.iteye.com/blog/649831 题目:在一个文件中有 10G 个整数,乱序排列,要求找出中位数.内存限制为 2G.只写出思路即可(内存限制为 2G的意思就 ...