AngularJS路由功能详解

深入理解AngularJS路由功能

案例解析:

访问地址:http://localhost:8080/test/app/route.html

AngularJS会自动跳转至:http://localhost:8080/test/app/route.html#/list,页面内容如图1所示。

跳转至详情页面的路由为:/list/:id,其中id是参数。点击ID#,页面将跳转至route-list.html,如图2所示。

观察控制台,会发现查看详情后,页面仅加载一次route-list.html,再次点击其他ID进入详情时,该页面不会重新加载。这就是AngularJS提供的单页面应用局部刷新的特性。

图1

图2

ppt 文件大小:5.44MB