Angular路由简单学习

Angular路由简单学习

现在非常流行单页面应用，传统都是通过ajax请求数据，前端拿到数据渲染到页面，这种无刷新的视图切换非常棒！但是致命的缺点就是刷新後无法保持原来的视图，解决此问题的一个方法是使用 hash，监听hashchange事件来进行视图切换，另一个方法是用HTML5的history API，通过pushState()记录操作历史，监听popstate事件来进行视图切换，也有人把这叫pjax技术。

现在开始介绍angular的$route！

首页

内容

标题

上面的例子很简单， 除了用template之外还可以用templateUrl引入html的模板文件。

在when传入控制器的指向，实现不同的页面显示不同的数据。

首页

内容

标题

以事件的方式映射路由页面。

首页

内容

标题

项目更复杂，页面相同(首页&index)，数据不同，需要对url进行传参。

首页

内容

标题

index

路由的事件监听。

首页

内容

标题

补充：angular事件的传播机制。

{{count}}

{{count}}

{{count}}

前面嵌套了三个controller，我们在中间的controller上绑定了click事件，使用$emit点击的时候，上面的controller也会触发事件。

如果是$broadcast点击就是往下传播。

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。