Angular 路由

路由：根据地址栏里面的url不一样，展示不一样的视图。做用为分发，路由自己没法解答问题，它会告诉你该找谁去解决问题。

#是锚点，防止向服务器端发送请求，angular进行拦截。对#/后面的东西去和内部$routeProvider的模板去进行匹配，不一样的视图交给不一样的控制器去处理

angular 路由是单独提供的功能模块ngRoute,也是一个单独发行的.js文件，使用路由的时候，须要手动去导入angular-route.js文件。使用这个文件的缘由是angular自己进行深层次的路由很麻烦，为了简化开发，因而就诞生出了route.js专门用来作路由的js文件

 

 

API一共有两个方法：

1.when( ) : 用于跳转指定的页面，用法在文章下面描述

2.otherwise( ) ： 不知足这些路由状况跳转的页面（index）

 

用angular的路由实现这个的布局是很繁琐的，因此咱们须要使用ui-router 来实现深层次的路由嵌套。

直接上项目代码

项目结构：

angular.js ：是gular提供的js文件

angular-route.js ：是路由使用的文件，必定要引入进项目

 

index.html页面内容

 

hello.index页面内容

 

bookList.html页面内容

 

app.js文件  ： 整个项目的配置文件

templateUrl： 跳转的页面

controller：跳转的页面所使用的控制器

一个页面要单独写一个控制器

 

效果为： 在url上手动切换锚点处关联字母，能够看到页面无缝隙的进行了跳转

若是不少人开发同一个项目，该如何合并呢？？

答：每一个人定义一个模块，让后整合到一块儿。bookStoreApp为主启动模块，[ ] 内部为依赖模块，把全部关联的模块都写进[ ]内，这样共同完成一个网站的开发。

 

route路由的缺点为：会产生一个http请求，会把路由到的页面请求回来。若是想避免这种状况，就使用下面的方案

 

注：本文做者不是大漠穷秋，是参考了大漠穷秋的视频讲解而后写出的demo。