我计划在我的大型应用程序中使用AngularJS。所以我正在寻找合适的模块来使用。

ngRoute (angular-route.js)和ui-router (angular-ui-router.js)模块之间的区别是什么?

在许多文章中,当使用ngRoute时,route是用$routeProvider配置的。然而,当与ui-router一起使用时,route使用$stateProvider和$urlRouterProvider配置。

我应该使用哪个模块来获得更好的可管理性和可扩展性?


当前回答

角1.倍

ng-route:

ng-route由angularJS团队开发用于路由。

ng-route:基于url位置的路由。

Ex:

$routeProvider
    .when("/home", {
        templateUrl : "home.html"
    })

ui-route:

ui路由器由第三方模块开发。

Ui-router:基于状态的路由

Ex:

 $stateProvider
        .state('home', {
            url: '/home',
            templateUrl: 'home.html'
        })

——> ui-router允许嵌套视图

——> ui-router比ng-route更强大

ng-router, ui-router

其他回答

如果你想使用ngRoute范例中实现的嵌套视图功能,可以尝试angular-route-segment -它旨在扩展ngRoute,而不是取代它。

ngRoute是Angular团队构建的一个模块,提供基本的客户端路由功能。这个模块为路由提供了一个相当强大的基础,并且可以很容易地构建在此基础上,从而提供可靠的路由功能,如本文所示(一定要阅读Ward Bell和作者Ben Nadel之间的评论——他们都是Angular的专业人士)。

Ui-router将焦点从以url为中心的路由转移到应用程序的“状态”上,这些状态可能反映在url中,也可能不反映在url中。

ui-router添加的主要功能是嵌套状态和命名视图。

嵌套状态允许您为应用程序的各个部分分离控制器逻辑。一个非常简单的例子是,应用程序的主要导航在顶部,辅助导航列表在左侧,内容在右侧。如果没有嵌套状态,单个控制器通常必须处理次要导航和内容的显示逻辑。嵌套路由允许分离这些关注点。

Named views are another additional feature of ui-router. With ngRoute, you can only have a single ngView directive on a page, whereas with named views in ui-router you can specify multiple ui-view directives, and then each state is able to affect the template and controller of the names views. A super simple example of this would be to have the main content of your app be the primary view, and then to also have a footer bar that would be a separate ui-view. In this scenario, the footer's controller no longer has to listen for state/route changes.

ngRoute和ui-router的比较可以在这个播客中找到。

让事情变得更复杂的是,请密切关注Angular团队期待为Angular 1.5和2.0版本发布的新的“官方”路由模块。这将取代ngRoute模块。这里是新路由器模块的当前文档——由于实现还没有最终确定,所以在这篇文章中它是相当稀疏的。看这里更多的新闻,当这个模块将实际发布。

1- ngRoute是由angular团队开发的,而ui-router是第三方模块。ngRoute基于路由URL实现路由,而ui-router基于应用程序的状态实现路由。3- ui-router提供ng-route提供的所有功能,并加上一些额外的功能,如嵌套状态和多个命名视图。

UI路由器让你的生活更轻松!你可以通过将它注入到你的AngularJS应用中来添加它…

ng-route是AngularJS核心的一部分,所以它更简单,给你的选择更少…

看这里可以更好地理解ng-route: https://docs.angularjs.org/api/ngRoute

另外,在使用它的时候,不要忘记使用:ngView ..

Ng-ui-router是不同的,但是:

https://github.com/angular-ui/ui-router但给你更多的选择....

ngRoute是AngularJS团队开发的一个模块,它是AngularJS核心的早期部分。

ui-router是AngularJS项目之外的一个框架,用于改进和增强路由功能。

来自ui-router文档:

AngularUI路由器是AngularJS的路由框架,它允许 您可以将接口的各个部分组织到状态机中。 不像Angular核心中的$route服务,它是围绕 URL路由,UI-Router是围绕状态组织的,这可能是可选的 附加路由和其他行为。 状态被绑定到命名的,嵌套的和并行的视图,允许您 强大地管理应用程序的界面。

它们都不是更好的,你必须选择最适合你的项目。

但是,如果您计划在应用程序中使用复杂的视图,并且希望处理“$state”概念。我建议你选择ui-router。