How to use Angular UI Router? and what are the advantages?

5

How to use Angular UI Router? and what are the advantages?

What long-term advantages of using it and not the standard of angularjs?

    
asked by anonymous 19.08.2014 / 03:41

1 answer

18

It is much better and more powerful than the native angular, I will make a basic comparison:

ngRoute

  • Routing based on url
    • That is, only one route per screen and one controller for it
  • Does not support multiple routes
    • All html should only have a <ng-view> tag, if you have more than one, Angular will inject the same content inside all
    • If a <ng-view> inside another, there already was, will generate recursion

Ui-Router

  • States based routing
    • That is, the URL is just a routing tool and not a delimiter
  • Supports route, multiple inheritance and views on the same screen
    • You can by two <ui-view> tags on the same page and inject a template with your own controller in each
    • You can also place%% of% within the other for routes within routes without problems, and having total control of the content injected and behavior of each one

Implementation

It's very similar to <ui-view> :

app.config(function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/home');

        $stateProvider
            .state("home", {
                url: "/home",
                templateUrl: "home-template.html",
                controller: "HomeController",
            });
    });

See also

21.08.2014 / 15:02