CODEWITHSUNDEEP
javascriptangularjsangular-ui-router
Remco Haszing
Remco Haszing

Reputation: 7809

angular-ui-router state not loaded on page load

I have created a website which uses angular-ui-router for mapping to multiple views. Everything works fine except for two things:

  1. When navigating to a website without an angular route, no view is loaded.
  2. No matter to which url the user navigates, the browser resets the url to my $urlRouterProvider.otherwise() value. The view is not altered though.

My main module looks like this:

angular.module('package.name', [
    'ui.router',
    'ui.bootstrap',
    'package.nameControllers'
]).
config(function($stateProvider, $urlRouterProvider) {
    $stateProvider.
    state('home', {
        url: 'home',
        templateUrl: 'templates/home.html',
        controller: 'homeCtrl'
    }).
    state('other', {
        url: 'other',
        template: 'Another page'
    });

    $urlRouterProvider.otherwise('/home');
});

What am I doing wrong?

I have created the same situation on this plunkr. The example of the url not changing can be seen here.

Upvotes: 2

Views: 1394

Answers (1)

user2847643
user2847643

Reputation: 2935

Urls for top level states should begin with a slash. Try adding the slash:

state('home', {
    url: '/home',
    templateUrl: 'templates/home.html',
    controller: 'homeCtrl'
}).
state('other', {
    url: '/other',
    template: 'Another page'
});

See here.

Upvotes: 4

Related Questions