angularJs 中 ng-route与ui-router路由的区别

小编昨天晚上翻到之前做得笔记,今天就跟大家闲谈下ng-route与ui-router的区别

angular的路由有两种,在angular最先出来的ngRoute的时候,后续又有了uiRoute


ng-Route  和  ui-route区别:


$when ****************  $state         路由状态配置的区别           

$routeParams ******** $stateParams      带参数的时候的配置区别

$routeProvider ********  $stateProvider             依赖注入的模块的区别

******** 
    页面中绑定的指令的区别

此外 ng是官方提供的,而ui是第三方提供的,适合项目中涉及大量嵌套模块时去使用,功能非常强大,它支持一切正常ng-route也可以做许多额外的功能。


首先插件引入有区别

ng-route插件引入

angularJs 中 ng-route与ui-router路由的区别_第1张图片


ui-router插件引入方式:

注:angular.min.js一定要在ui-route引入之前引入

angularJs 中 ng-route与ui-router路由的区别_第2张图片


下边给大家分享下刚写的一个关于ui-router路由的小案例,希望大家看完这个小案例能够对ui-router路由有更深刻的认识

angularJs 中 ng-route与ui-router路由的区别_第3张图片


首先需导入angularjs插件以及index所依赖的js导入

下边是对应js文档里的代码

angularJs 中 ng-route与ui-router路由的区别_第4张图片


这是跳转的页面,点击hello和world会跳转不同的模块,而ng-route实现多视图的切换不太容易


angularJs 中 ng-route与ui-router路由的区别_第5张图片


你可能感兴趣的:(angularJs 中 ng-route与ui-router路由的区别)