$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/#/some/path?foo=bar&baz=xoxo#hashValue
$location.url();// some/path?foo=bar&baz=xoxo
$location.protocol();// http
$location.host();// example.com
$location.port();// 8080
$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对象可以用来获取浏览器窗口各项属性(如窗口高度宽度、浏览器版本等等)。

Angular - - $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. AngularJs $location 和 $window

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

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

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

随机推荐

  1. js中如何获取时间

    var myDate = new Date();myDate.getYear();        //获取当前年份(2位)myDate.getFullYear();    //获取完整的年份(4位,1 ...

  2. IE6里面display:inlineblock使得块元素成行排列,没用

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

  3. 004-Python字符串

    Python 字符串(str) 字符串是 Python 中最常用的数据类型.我们可以使用引号('或")来创建字符串.创建字符串很简单,只要为变量分配一个值即可. var1 = "H ...

  4. Python之路:堡垒机实例以及数据库操作

    一.堡垒机前戏 开发堡垒机之前,先学习Python的paramiko模块,该模块基于SSH用于连接远程服务器并执行相关操作. SSHClient 用于连接远程服务器并执行基本命令 基于用户名密码连接: ...

  5. PAT (Advanced Level) 1012. The Best Rank (25)

    简单排序题. 注意:分数相同的人排名相同. #include<iostream> #include<cstring> #include<cmath> #includ ...

  6. [转]Axis2创建WebService实例

    以下文章来自http://clq9761.iteye.com/blog/976029,作者clq9761 一.Axis2的下载和安装 1.可从http://ws.apache.org/axis2/ 下 ...

  7. UIScroll和UIPickView

    .h #import <UIKit/UIKit.h> #define WIDTH self.view.frame.size.width #define HEIGHT self.view.f ...

  8. STM32 的加密实现(转)

    源:STM32 的加密实现 基于STM32F103的ID号对应用程序的保护方法 目的:对运行于STM32的嵌入式代码程序进行加密 编译环境:IAR Embedded System for ARM5.5 ...

  9. Linux 分区和目录解析

    转自:http://www.cnblogs.com/apprentice89/archive/2012/12/17/2821332.html 计算机中存放信息的主要的存储设备就是硬 盘,但是硬盘不能直 ...

  10. Android 状态栏通知Notification、NotificationManager详解

    http://www.cnblogs.com/onlyinweb/archive/2012/09/03/2668381.html