ngRoute
$routeProvider
配置路由的时候使用。
方法：
when(path,route);
在$route服务里添加一个新的路由。
path：该路由的路径。
route：路由映射信息。
controller：字符串或函数，指定控制器。
controllerAs：一个用于控制器的标识符名称。。
template：字符串或函数，html模板。
templateUrl：字符串或函数，html模板的地址。
resolve：对象，一个应该注入控制器的可选的映射依赖关系。如果任何一个依赖关系是承诺，则路由将等该承诺被解决/拒绝后才实例化控制器。
redirecTo：字符串或者函数，URL重定向。
otherwise(params);
设置在没有其他路由定义被匹配时，将使用的默认路由。
ngView
路由配置的页面在HTML的view里的显示的视图区域。
$route
用于在js里对路由的操作。
依赖：$location $routeProvider
方法：
reload();
使路由服务重新加载当前路由，即使路由没有改变。
updateParams(newParams);
操作路由服务更新当前的URL，使用newParams里指定的路由参数指定当前路由参数。
newParams：将URL参数名称映射到value。
事件：
$routeChangeStart
URL路由开始变化（未跳转成功）的时候触发的事件。
event:合成的事件对象。
next：将跳转的route信息。
current：当前route信息。
$routeChangeSuccess
URL路由变化成功的时候触发的事件。
event:合成的事件对象。
current：当前route信息。
previous：上一个route信息。
$routeChangeError
URL路由变化失败的时候触发的事件。
event:合成的事件对象。
current：当前route信息。
previous：上一个route信息。
rejection：拒绝承诺，通常是失败承诺的错误。
$routeUpdate
当承诺被拒绝时广播。
event:合成的事件对象。
current：当前route信息。
$routeParams
$routeParams服务运行检索当前路由的参数集。
ngRoute使用代码：
<div ng-app="Demo" ng-controller="testCtrl as ctrl">
<a href="#/index/page1">page1</a> - <a href="#/index/page2">page2</a> - <a href="lavascript:void(0)" ng-click="ctrl.reload()">reload</a> - <a href="lavascript:void(0)" ng-click="ctrl.update()">update</a>
<div ng-view></div>
<script type="text/ng-template" id="page1.tpl">
this is page1.{{fisrtCtrl.value}}
</script>
<script type="text/ng-template" id="page2.tpl">
this is page2.{{secondCtrl.value}}
</script>
</div>
(function () {
angular.module("Demo", ["ngRoute"])
.config(["$routeProvider",routeConfig])
.controller("testCtrl", ["$route","$scope",testCtrl])
.controller("firstPageCtrl",firstPageCtrl)
.controller("secondPageCtrl",secondPageCtrl);
function routeConfig($routeProvider){
$routeProvider.otherwise("/index/page1");
$routeProvider
.when("/index/page1",{
templateUrl:"page1.tpl",
controller:"firstPageCtrl",
controllerAs:"fisrtCtrl"
})
.when("/index/page2",{
templateUrl:"page2.tpl",
controller:"secondPageCtrl",
controllerAs:"secondCtrl"
});
};
function testCtrl($route,$scope) {
var vm = this;
vm.reload = function(){
$route.reload();
};
vm.update = function(){
$route.updateParams({name:"beast"});
};
$scope.$on("$routeChangeStart",function(event,nextRoute,currentRoute){
//event.preventDefault(); //可控制不跳转页面，主要在路由权限控制的时候用的多
console.log(nextRoute,currentRoute);// 下一个路由信息和上一个路由信息
});
};
function firstPageCtrl(){
var vm = this;
vm.value = "hello world";
console.log("this is page1");//用于证明reload
}
function secondPageCtrl(){
var vm = this;
vm.value = "Hello World";
console.log("this is page2");//用于证明reload
}
}());
这里直接使用了ng-template把两个模板写在一个页面，在实际使用中，可以把两个模板分开分别放到两个不同的html文件中，并且放到一个规定的文件中，这样可方便于管理。