$route

-$routeProvider服务

-依赖ngRoute模块

$route能够在路径发生改变的时候,渲染不同的视图,调用不同的控制器.它监测了$location.url(),然后根据路径来匹配相应的路由,路由的定义方法详见$routeProvider的API.

$route通常和$routeProvider服务和ngView指令一起使用

依赖:

$location
$routeParams

方法:

reload()

在路由没有改变的时候,再次加载当前路径的路由,重新渲染ng-view,实例化一个控制器

事件:

$routeChangeStart

在路由变化之前被触发,在这个时间点上,路由服务会resolve所有的路由变化所需要的依赖(详见$routeProvider),以及获取需要被渲染的视图模板,已经解析所有加载新路由所需要的依赖.当所有的依赖都被解析以后,$routeChangeSuccess事件就会被触发

类型: broadcast

目标元素: root scope(即在根作用域内绑定)

$routeChangeSuccess

在所有路由依赖被解析完成后触发,ng-view会根据指令实例化控制器,渲染视图

类型: broadcast

目标元素: root scope

$routeChangeError

当解析路由依赖时,promise对象没有正常解析,而是reject出错的时候被触发. (详见$q)

类型: broadcast

目标元素: root scope

$routeUpdate

reloadOnSearch属性设置为false,再次使用相同的控制器实例

这个属性在$route.current.$route对象里

类型: broadcast

目标元素: root scope

属性:

(以下这段不是翻译,胜似翻译)

$route对象共有三个属性:

1.current

current对象又有以下几个属性:

①$route:

$route对象包含controller属性: 当前视图的控制器

$route对象包含reloadOnSearch属性: 见上

$route对象包含resolve属性: 需要被解析的依赖(还没有解析)

$route对象包含templateUrl属性: 视图模板路径

②locals:

locals对象包含$scope属性: 当前作用域

locals对象包含$template属性: 视图模板的内容

locals对象还包含已经解析完的依赖(在这里就是recipe属性)

③params:

当前路径的参数对象

④pathParams:

也是当前路径的参数对象(区别不详)

2.reload方法

3.routes对象:

routes对象包含了当前单页应用的所有路由规则,每个路由规则所对应的视图模板,控制器,依赖,以及reloadOnSearch属性

这里是一个$route的demo,这个demo故意延迟路由的resolve的解析时间,

通过这个demo可以看到,分析下面这几项的变化情况:

$location.path():

路由一变化就随之变化,获取新的url

$route.current.templateUrl:

路由一变化就随之变化,获取新路由的模板url

$route.current.params:

路由一变化就随之变化,获取新路由的模板url的参数

$route.current.scope:

路由一变化,它会成为空,等到路由变化完成,再把新路由的作用域赋给它

$routeParam:

路由一变化,它不会变为空,会保持上一次路由变化,等到路由变化完成,再把新路由url参数赋给它

视图:

路由变化完成后进行渲染

demo地址:

https://github.com/OOP-Code-Bunny/angular/tree/master/%24route

angular -- $route API翻译的更多相关文章

  1. WebSettings 文档 API 翻译 常用设置

    . setDefaultFontSize(int size)  Sets the default font size. The default is 16. setDefaultTextEncodin ...

  2. python使用百度api翻译中英文

    python使用百度api翻译中英文 写程序取变量名的时候,常常需要翻译单词,或者将中文翻译成英语.有道词典,必应词典都很好,可是...命令行习惯了还是觉得用在cmd里面调出程序使用起来也许会更爽.于 ...

  3. C# 有道API翻译 查询单词详细信息

    原文:C# 有道API翻译 查询单词详细信息 有道云官方文档 有道云翻译API简介:http://ai.youdao.com/docs/doc-trans-api.s#p01 有道云C#Demo : ...

  4. Monkey Android API 翻译

      此篇笔记,记录了API中,对monkey用法的说明,基于Android Studio 2.2.3. Monkey是一个运行在Android模拟器或者Android设备上的程序,通过使用monkey ...

  5. 【Android Api 翻译3】android api 完整翻译之Application Fundamentals (学习android必须知道的)

    Android应用程序是用Java编程语言编写的.Android SDK工具把应用程序的代码.数据和资源文件一起编译到一个Android程序包中(这个程序包是以.apk为后缀的归档文件),一个Andr ...

  6. Win32 API翻译

    这是从MSDN里面的Win32 SDK API函数.结构.通知.消息等等超过3000个.其中一半是整理自别人翻译. http://files.cnblogs.com/files/sishenzaixi ...

  7. angular -- $routeParams API翻译

    原api出处: https://docs.angularjs.org/api/ngRoute/service/$routeParams $routeParams 可以获取当前路径参数. 需要ngrou ...

  8. C#调百度通用翻译API翻译HALCON的示例描述

    目录 准备工作 参数简介 输入参数 输出参数 使用HttpClient 翻译工具类 应用:翻译HALCON的示例描述 准备工作 HALCON示例程序的描述部分一直是英文的,看起来很不方便.我决定汉化一 ...

  9. DOJO官方API翻译或解读-dojo/store (自定制存储器)

    dojo/store 是对已存数据的访问和存储的统一接口,dojo/store意图以一个简单.易于使用和扩展的API来,替代.集合和改善 dojo/data 和dojox/storage .基于HTM ...

随机推荐

  1. cat 命令(转)

    原文:http://www.cnblogs.com/peida/archive/2012/10/30/2746968.html cat命令的用途是连接文件或标准输入并打印.这个命令常用来显示文件内容, ...

  2. Electron 入门案例1

    1:package.json 通过npm init生成package.json文件,内容如下: { "name": "t02", "version&q ...

  3. jquery.dataTables动态列

    jquery.dataTables  版本1.10.7 直接上代码: 0.table <table id="popReportTable"> <thead> ...

  4. innodb_file_per_table

    MySQL InnoDB引擎 默认会将所有的数据库InnoDB引擎的表数据存储在一个共享空间中:ibdata1,当增删数据库的时候,ibdata1文件不会自动收缩,单个数据库的备份也将成为问题.通常只 ...

  5. vue diff算法 patch

    1.diff比较算法 图示: diff比较只会在同层级进行, 不会跨层级比较. 所以diff是:广度优先算法. 时间复杂度:O(n) 代码示例: <!-- 之前 --> <div&g ...

  6. NGINX原理 之 SLAB分配机制(转)

    1 引言 众所周知,操作系统使用伙伴系统管理内存,不仅会造成大量的内存碎片,同时处理效率也较低下.SLAB是一种内存管理机制,其拥有较高的处理效率,同时也有效的避免内存碎片的产生,其核心思想是预分配. ...

  7. 在Html.ActionLink中运用二维判断语句

    @Html.ActionLink("公告信息", "notice", "article", null, new { @class = Vie ...

  8. XML 文档结构必须从头至尾包含在同一个实体内

      XML 文档结构必须从头至尾包含在同一个实体内 CreateTime--2018年4月2日16:40:58 Author:Marydon 问题还原: <![CDATA[ <?xml v ...

  9. SettingsMyEclipse

      迁移时间--2017年5月20日10:39:42 Author:Marydon-----------------------------------MyEclipse单独设置项---------- ...

  10. XMPP serverejabberd-14.12本地搭建

    这里记录下我搭建ejabberd-14.12的过程. 首先下载:http://pan.baidu.com/s/1hqzjezq  这里我传到我的网盘一份, 大家也能够到官网下载http://xmpp. ...