Default route for angular ui router

问题:

The sample demo of the angular ui router has this link for the start page:

full url of 'ui-router' is / or http://angular-ui.github.io/ui-router/sample/#/

full url of 'about' is /about or http://angular-ui.github.io/ui-router/sample/#/about

When I was using durandalJS there was a limitation that the default url is just "/" there can be no "/ui-router".

Has the angular ui router plugin the same limitation?

回答1:

See here there is an "otherwise" option for a default route.

If you are talking about default route PARAMETERS, then there is an answer here.

回答2:

The default route for ui-router can be whatever you want it to be, there is no limitaion like in DurandalJS. Just use:

$stateProvider
    .state("otherwise", { url : '/otherwise'...})

This is the official documentaion of ui-router, however I could not find the otherwise technique in there: https://github.com/angular-ui/ui-router/wiki

@apohi: ui-router is not angular-route. Your reply is adressing the wrong module.

回答3:

You can do it this way:

angular.module('MyApp', ['ui.router']).config([
  '$stateProvider', function ($stateProvider) {
     $stateProvider.state('default', {
     controller: 'MyController',
     templateUrl: 'path/to/index.html',
     url:''
  })
)];

That way whenever the url is on the root of your site ui-router will capture it on a state that matches, in this case, 'default'.

回答4:

use the $urlRouterProvider and its otherwise function:

angular.module('MyApp', ['ui.router'])
  .config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
     $stateProvider.state('default', {
     controller: 'MyController',
     templateUrl: 'path/to/template.ng.html',
     url:'/default'
    })
    $urlRouterProvider.otherwise('/default')
  })];

回答5:

You can use $urlRouterProvide.otherwise. This will work if you try to navigate to a route url that has not been defined.

Taken from here.

function configurUIRoutes($stateProvider, $urlRouterProvider) {

$stateProvider
    .state('myhomepage',
    {
        abstract: false,
        url: '/myhomepageurl',
        templateUrl: "some-path/staff-admin.html",
        controller: 'HomeController'
    });

$urlRouterProvider.otherwise('/myhomepageurl'); // User will be taken to /myhomepageurl if they enter a non-matched entry into URL

}

回答6:

The simplest way of all

add $urlRouterProvider service in config(function($urlRouterProvider))

and then

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

         $urlRouterProvider.otherwise('employeesState'); //default route

         $stateProvider.state('employeesState', function(){
              //state configuration here
         }) //employees state

         $stateProvider.state('cutomersState', function(){
             //state configuration here
         })
}

name any of the state in otherwise function to which you want as your default state/route