ngRoute (angular-route.js) 和 ui-router (angular-ui-router.js) 模块有什么不同呢?

很多文章中都有说道:当时ngRoute在路由配置时用$routeProvider,但是当ui-router路由配置时用 $stateProvider 和 $urlRouterProvider。

那么它们有什么不同呢?

1、ngroute是用AngularJS框架的核心部分。

2、ui-router是一个社区库,它是用来提高完善ngroute路由功能的。

那么我到底用哪个,或者说,哪个更适合可管理性和适合可扩展性?

ui-router路由器是一个第三方模块,功能非常强大。它支持一切正常ngroute也可以做许多额外的功能。

下边是常见的选择ui-router路由器的因素,而不用ngRoute。

  • UI-Router路由器允许嵌套视图(nested views)和多个命名视图(multiple named views)。这是非常有用的应用程序,你可能有较多的页面来继承其他部分。@camnpr
  • ui-router允许你有很强的类型之间的连接状态的基础上的状态名称。
     
      $stateProvider.state(state, {
    url: '/' + lastState,
    controller: 'ctrl.' + state,
    templateUrl: '/views/' + path + '.html'
    });

    通过构建ui-sref来实现不同的状态的链接到不同的页面(或者模板)

    <a ng-repeat="camnpr in group.items" ng-show="{{camnpr.show}}"ui-sref="{{camnpr.state}}">{{item.label}}</a>

    同时你的路由可以访问动态创建的链接

  • states允许你通过$statsParams来轻松的传递信息,允许不同的信息不同的states的map格式。

综上所述,angular-ui-router是一个功能更强大,更轻松配置项目的一个模块库,是ngRouter的升级版!

ngRoute (angular-route.js) 和 ui-router (angular-ui-router.js) 模块有什么不同呢?的更多相关文章

  1. angular route 与 django urls 冲突怎么解决?

    app.js var app = angular.module('app', [ 'ngResource', 'ngRoute', // 'ui.bootstrap', // 'ngResource' ...

  2. [Web UI]对比Angular/jQueryUI/Extjs:没有一个框架是万能的

    Angular不能做什么?对比Angular/jQueryUI/Extjs 框架就好比兵器,你得明白你手里拿的是屠龙刀还是倚天剑,刀法主要是砍,剑法主要是刺.对于那些职业喷子和脑残粉,小僧送你们两个字 ...

  3. Atitit. js mvc 总结(2)----angular 跟 Knockout o99 最佳实践

    Atitit. js mvc 总结(2)----angular  跟 Knockout o99 最佳实践 1. 框架 angular 跟Knockout 1 2. 2. 简单的列表绑定:Knockou ...

  4. 关于Iscroll.js 的滑动和Angular.js路由冲突问题

    Iscroll主要应用于app移动端开发. 主要代码: window.onload=function(){ var myIscroll=new IScroll(".headerNav&quo ...

  5. [从 0 开始的 Angular 生活]No.38 实现一个 Angular Router 切换组件页面(一)

    前言 今天是进入公司的第三天,为了能尽快投入项目与成为团队可用的战力,我正在努力啃官方文档学习 Angular 的知识,所以这一篇文章主要是记录我如何阅读官方文档后,实现这个非常基本的.带导航的网页应 ...

  6. 集成 Kendo UI for Angular 2 控件

    伴随着 Angular 2 的正式 release,Kendo UI for Angular 2 的第一批控件已经发布了,当前是 Beta 版本,免费使用. 官方站点:Kendo UI for Ang ...

  7. Kendo UI for Angular 2 控件

    Kendo UI for Angular 2 控件 伴随着 Angular 2 的正式 release,Kendo UI for Angular 2 的第一批控件已经发布了,当前是 Beta 版本,免 ...

  8. angular.js前端分层开发(页面和js代码分离,并将js代码分层)

    一. 抽取模块成base.js文件// 定义模块: var app = angular.module("eshop",['pagination']); 二. 抽取服务成brandS ...

  9. Angular build Error:In this configuration Angular requires Zone.js

    Angular cli 运行 build后打开生成的index.html报错:In this configuration Angular requires Zone.js 生成代码如下: ng bui ...

  10. [译]基于Vue.js的10个最佳UI框架,用于构建移动应用程序

    原文查看10 Best Vue.js based UI Frameworks for Building Mobile Apps 如果您期待使用Vue.js构建移动应用程序,那么您可以选择许多可用的UI ...

随机推荐

  1. JAVA学习笔记16——线程生命周期

    当线程被创建并启动以后,它既不是一启动就进入了执行状态,也不是一直处于执行状态,在线程的生命周期中,它要经过新建(New).就绪(Runnable).运行(Running).阻塞(Blocking)和 ...

  2. mysql外键是多个id组成的字符串,查询方法

    借鉴:mysql使用instr达到in(字符串)的效果 结论:select * from 表名where INSTR(CONCAT(字符串),CONCAT(表id)) 问题来源:一表中的某字段是另一表 ...

  3. HDU - 6264 - Super-palindrome(思维)

    题意: 给出一个字符串,使得所有的奇数连续子串为回文串,输出最小变化次数 思路: 分析过后,只存在两种情况,1全部为一种字母,2形如abab交替类型 对于奇数位和偶数位单独计数,只需计算出奇数位或者偶 ...

  4. exception对象的使用及常用方法

    exception对象的使用及常用方法 制作人:全心全意 exception对象用来处理JSP文件执行时发生的所有错误和异常,只有在page指令中设置为isErrorPage属性值为true的页面中才 ...

  5. ubuntu root用户登陆

    sudo vi /etc/lightdm/lightdm.conf   (如果没有该文件则创建,内容如下) [SeatDefaults] user-session=ubuntu greeter-ses ...

  6. Centos下Yum安装PHP5.5,5.6,7.0及扩展

    默认的版本太低了,手动安装有一些麻烦,想采用Yum安装的可以使用下面的方案: 1.检查当前安装的PHP包 yum list installed | grep php 如果有安装的PHP包,先删除他们 ...

  7. BZOJ 4385 洛谷3594 POI2015 WIL-Wilcze doły

    [题解] 手残写错调了好久QAQ...... 洛谷的数据似乎比较水.. n个正整数!!这很重要 这道题是个类似two pointer的思想,外加一个单调队列维护当前区间内长度为d的子序列中元素之和的最 ...

  8. codechef 营养题 第一弹

    第一弾が始まる! 定期更新しない! 来源:http://wenku.baidu.com/link?url=XOJLwfgMsZp_9nhAK15591XFRgZl7f7_x7wtZ5_3T2peHh5 ...

  9. 调试pcb板子的步骤

    在从外边焊回来的板子中查找问题的时候,如果只是简单的 一通乱调,很有可能一下子就调好了,但是大多数的时候是调了半天,不知道接下来该如何进行,因此,严格的按照步骤走,是个不错的想法: 1.拿到板子的第一 ...

  10. HTML5中Canvas概述

    一.HTML5 Canvas历史 Canvas的概念最初是由苹果公司提出的,用于在Mac OS X WebKit中创建控制板部件(dashboard widget).在Canvas出现之前,开发人员若 ...