19

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?

6 Answers 6

18

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.

Sign up to request clarification or add additional context in comments.

2 Comments

The OP was asking about ui-router, your first link points to documentation on angular-router.
Otherwise should be a function call on $urlRouterProvider, not the name passed to .state()—unless you intend to set url: '/otherwise' on your default route…
7

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'.

Comments

5

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')
  })];

Comments

4

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.

6 Comments

@apohi: ui-router != angular-route.
Why was this answer chosen? angular router(ngRoute) is different from angular ui router(ui.router). This might confuse the beginners.
@boi_echos I'm a beginner, but from what I see in this answer it looks correct. UI-Router has an otherwise function. Can you point out what is incorrect?
I fixed the first link.
@hofnarwillie This answer says that otherwise is an option (e.g., a property passed in on an object) instead of a function.
|
1

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

}

Comments

1

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.