O'Reilly书上的伪代码

var someModule = angular.module('someModule',[...module dependencies]);

someModule.config(function($routeProvider){
$routeProvider
.when('url',{controller:aController, templateUrl:'/path/to/template'})
.when(...)//other mappings for your app
.otherwise(...)//what to do if nothing else matches
});

$route被用于URLS到controller和view(HTML模板)之间的链接,它会监控$location.url()并试图对此路径及对应的路由配置进行映射,使用时需要注入安装ngroute模块。

var someModule = angular.module('someModule',['ngRoute']);

举个详细的栗子

var app = angular.module('app', ['ngRoute']);
app.config(function ($routeProvider){
$routeProvider
.when('/other', {
controller: 'otherCtrl',
templateUrl: 'content/views/other.html',
publicAccess: true
})
.when('/', {
controller: 'homeCtrl',
templateUrl: 'content/views/home.html'
})
.when('/other/:id', {
controller: 'otherDetailCtrl',
templateUrl: 'content/views/otherDetail.html',
publicAccess: true
})
.otherwise({
redirectTo: '/'
});
} app.controller('homeCtrl',function($scope,$http){
console.log('i am home page');
$scope.title = 'i am home page';
}); app.controller('otherCtrl',function($scope){
console.log('i am other page');
$scope.title = 'i am other page';
}); app.controller('otherDetailCtrl',function($scope, $routeParams, $location){
var id = $routeParams.id;
if(id == 0) {
$location.path('/other');
}
console.log('i am otherDetailCtrl page');
$scope.title = 'i am otherDetailCtrl page';
});

在$route(路由)中,提供了两个依赖性服务:$location、$routeParams。

$location、$routeParams均可在controller中使用,如上otherDetailCtrl中,可通过$routeParams获取路由时所传参数,可通过$location进行路由跳转。

angularJS $routeProvider的更多相关文章

  1. 一篇入门AngularJS

    目录 1.AngularJS 应用 2.AngularJS 指令 3.AngularJS 表达式 4.AngularJS 模型 5.AngularJS 控制器 6.AngularJS 作用域 7.An ...

  2. 摆脱DOM操作,从TodoMVC看angularJS

    取代jQuery? 我很久之前便听说了angularJS的大名,之前的leader也经常感叹angularJS的设计如何如何精妙,可叹一直没有机会深入了解,国庆长假因为没钱出游,倒是可以对他做一个了解 ...

  3. 7_nodejs angularjs

    webstrom使用: ctrl+b/点击,代码导航,自动跳转到定义 ctrl+n跳转指定类 ctrl+d复制当前行ctrl+enter另起一行ctrl+y删除当前行 ctrl+alt/shift+b ...

  4. [后端人员耍前端系列]AngularJs篇:30分钟快速掌握AngularJs

    一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来打造一个单页面程序,后面一篇文章将介绍如何使用AngularJs的开发一个单页面应用 ...

  5. AgularJS中Unknown provider: $routeProvider解决方案

    最近在学习AgularJS, 做到http://angularjs.cn/A00a这一步时发现没有办法执行路由功能, 后来翻看控制台日志,发现提示Unknown provider: $routePro ...

  6. [渣翻译] 在ASP.NET MVC WebAPI项目中使用 AngularJS

    原文地址http://blog.technovert.com/2013/12/setting-up-angularjs-for-asp-net-mvc-n-webapi-project/ 我们最近发布 ...

  7. routeProvider

    In a previous post about testing I mentioned that route resolves can make authoring unit tests for a ...

  8. 【js类库AngularJs】web前端的mvc框架angularjs之hello world

    AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核 ...

  9. JS框架~Angularjs

    无意中看到anytao的项目,工作台,使用了Angularjs框架,感觉在前端表现上用户体验比较好,于是就简单看了一下,原来使用很简单,或者说,人家把代码封装的很好,以至于开发人员调用时比较简单,呵呵 ...

  10. 拥抱AngularJS

    文中一些地方AngularJS简称ng 简介: ng诞生于2009年,由Misko Hevery等创建,后被Google收购,为克服HTML在构建应用上的不足而设计. 是一款优秀的前端JS框架,核心特 ...

随机推荐

  1. C#简单窗体应用程序(三)

    使用C#创建窗体应用程序的基本步骤: (1)创建项目: (2)用户界面设计: (3)属性设置: (4)编写程序代码: (5)保存.调试.运行: 例题:设计歌曲列表界面,效果如下: 第一步:创建项目: ...

  2. 命令行执行python文件时提示ImportError: No module named 'xxx'

    背景: 最近在写接口自动化测试框架的时候发现,框架使用pycharm ide的时候可以正常跑测试用例,但是在dos窗口输入命令执行测试的时候,import项目内部的包时报错“ModuleNotFoun ...

  3. [转帖]CPU 的缓存

    缓存这个词想必大家都听过,其实缓存的意义很广泛:电脑整机最大的缓存可以体现为内存条.显卡上的显存就是显卡芯片所需要用到的缓存.硬盘上也有相对应的缓存.CPU有着最快的缓存(L1.L2.L3缓存等),缓 ...

  4. 笔记:delphi 与 Query

    以下不保存证正确 Query用SQL语言执行过的,没有必要Cancel.Post,因为其会对数据库直接操作:执行Update.Insert.Delete请用SQL语句: 用Table使用对当前记录直接 ...

  5. Introduction to One-class Support Vector Machines

    Traditionally, many classification problems try to solve the two or multi-class situation. The goal ...

  6. BZOJ5254 FJWC2018红绿灯(线段树)

    注意到一旦在某个路口被红灯逼停,剩下要走的时间是固定的.容易想到预处理出在每个路口被逼停后到达终点的最短时间,这样对于每个询问求出其最早在哪个路口停下就可以了.对于预处理,从下一个要停的路口倒推即可. ...

  7. vyos 基础配置

    vyos 基础配置 http://www.lowefamily.com.au/2015/11/29/using-a-vyos-router-with-hyper-v/1/http://thomasvo ...

  8. 文件查找 locate 和 find

    locate locate命令依赖于一个数据库文件,系统默认每天会检索一次系统中的所有文件,然后将检索到的文件记录到数据库中; 在执行查找时,可直接到数据库中查找记录,所以locate比find反馈更 ...

  9. Reactor模式,或者叫反应器模式 - 为什么用多路io复用提供吞吐量

    Reactor这个词译成汉语还真没有什么合适的,很多地方叫反应器模式,但更多好像就直接叫reactor模式了,其实我觉着叫应答者模式更好理解一些.通过了解,这个模式更像一个侍卫,一直在等待你的召唤,或 ...

  10. HDU 6071 同余最短路 spfa

    Lazy Running Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 524288/524288 K (Java/Others)To ...