AngularJS - 路由入门

我们有很多方法让一个视图随着用户的操作进行变化。
但是，只是单单一个视图就要满足所有的需求会让代码变得非常复杂。
也许我们可以使用ng-include来引用各种模板，但这只限于部分场景。

于是我们可以将视图拆分为两种:

如此一来，我们便可以使用route实现模板和布局视图的组装，以构建多视图的应用。

ngRoutes并不属于核心模块，我们需要额外引用angular-route.js，并在声明应用时:

?

route需要通过$routeProvider定义，比如这样:

OMG，这种定义方式太晦涩了，我们不能像定义指令时用directive()那样用route()什么的吗?
其实directive()什么的都是config()的语法糖。

比如我们这样声明一个指令:

其实是:

provider用来实例化依赖并对外提供API，比如这里的$route服务就是通过相应的$routeProvider对外提供API，比如when()，我们通过这些API设置路由规则。

另外，provider是怎么来的?
Injector对module进行配置时，会在这些module中注册所有定义的provider，必要时会注入服务，而服务的实例化则需要provider来进行。

不同的路由模式下URL会以不同的格式呈现，我们有两种模式可以选择。

路由模式也通过$routeProvider进行设置，比如:

?

这里使用的when(path,route)一共两个参数。

?

我们用ng-view接收对应的视图模板，给$route对应的视图占位。
mg-view的优先级为1000，也就是说AngularJS不会运行同一个元素上的低优先级指令。

ngView指令遵循以下规则。

?

既然涉及到了路径，就不得不说$location服务。
感觉和windows.location差不多，但$location只能用来在内部访问路由，无法刷新整个页面。

下面列出$location的常用的一些方法。

有几个路由相关的事件如下:

?

希望你喜欢，并分享我的工作~带你走近AngularJS系列：