javascript - with - ui router angularjs
What is the difference between angular-route and angular-ui-router? (10)
ngRoute is a angular core module which is good for basic scenarios. I believe that they will add more powerful features in upcoming releases.
URL: https://docs.angularjs.org/api/ngRoute
Ui-router is a contributed module which is overcome the problems of ngRoute. Mainly Nested/Complex views.
URL: https://github.com/angular-ui/ui-router
Some of the difference between ui-router and ngRoute
I'm planning to use AngularJS in my big applications. So I'm in the process to find out the right modules to use.
What is the difference between ngRoute (angular-route.js) and ui-router (angular-ui-router.js) modules?
In many articles when ngRoute is used, route is configured with $routeProvider. However, when used with ui-router, route is configured with $stateProvider and $urlRouterProvider.
Which module should I use for better manageability and extensibility?
1- ngRoute is developed by angular team whereas ui-router is a 3rd party module. 2- ngRoute implements routing based on the route URL whereas ui-router implements routing based on the state of the application. 3- ui-router provides everything that the ng-route provides plus some additional features like nested states and multiple named views.
ng-View (developed by the AngularJS team) can be used only once per page, whereas ui-View (3rd party module) can be used multiple times per page.
ui-View is therefore the best option.
Angular 1.x
ng-route is developed by the angularJS Team for routing.
ng-route: url (Location) based routing.
Ex:
$routeProvider
.when("/home", {
templateUrl : "home.html"
})
ui-router is develoepd by 3rd party module.
ui-router : state based routing
Ex:
$stateProvider
.state('home', {
url: '/home',
templateUrl: 'home.html'
})
--> ui-router allows for nested views
--> ui-router more powerful than ng-route
AngularUI Router is a routing framework for AngularJS, which allows you to organize the parts of your interface into a state machine. Unlike the $route service in the Angular ngRoute module, which is organized around URL routes, UI-Router is organized around states, which may optionally have routes, as well as other behavior, attached.
Basic thing you have to know: ng-router uses $location.path() and ui-router uses $state.go
Rest us all features.
If you want to make use of nested views functionality implemented within ngRoute paradigm, try angular-route-segment - it aims to extend ngRoute rather than to replace it.
ngRoute is a basic routing library, where you can specify just one view and controller for any route.
With ui-router, you can specify multiple views, both parallel and nested. So if your application requires (or may require in future) any kind of complex routing/views, then go ahead with ui-router.
This is best getting started guide for AngularUI Router.
ngRoute is a module developed by the Angular.js team which was earlier part of the Angular core.
ui-router is a framework which was made outside the Angular.js project to improve and enhance routing capabalities.
ngRoute is part of the core AngularJS framework.
ui-router is a community library that has been created to attempt to improve upon the default routing capabilities.
Here is a good article about configuring/setting up ui-router:
