I'm trying to debug the above code which I feel like this is very useful >.<

I can't even find what is wrong in my code and don't really know where to start since Angularjs still very new to me.

I'm trying to localize Angularjs app. I know this is missing a lot of context in order to get a help, but I'm trying to see what information that I should give that would help on this debugging.

I've gone through any indexOf in angularjs file and I can see few things is undefined but don't know if that would be helpful.

So I've traced the problem here and this is what I have figured is the problem, but still counldn't figure out why...

config(['$routeProvider', '$locationProvider',
  function ($routeProvider, $locationProvider) {
    $routeProvider.when('/:locale?/:username/badges', {
      templateUrl: '_partials/badges.html',
      controller: 'badges'
    })
    .when('/:username/badges', {
      templateUrl: '_partials/badges.html',
      controller: 'badges'
    })
    .when('/:username/teaching-resources', {
      templateUrl: '_partials/teaching-resources.html',
      controller: 'teachingResources'
    })
    .when('/:username/makes', {
      templateUrl: '_partials/makes.html',
      controller: 'makes'
    })
    .when('/:username/likes', {
      templateUrl: '_partials/likes.html',
      controller: 'likes'
    })
    .when('/:username/events', {
      templateUrl: '_partials/events.html',
      controller: 'events'
    })
    .when('/:username', {
      templateUrl: '_partials/badges.html',
      controller: 'badges'
    });

    $routeProvider.otherwise({
      redirectTo: '/error/404'
    });

The URL that I'm visiting for default page is:

This will fail and throw the error.

http://localhost:1969/en-US/user/someUserName

This will work fine

http://localhost:1969/user/someUserName

UPDATE

I figured out! This is the problem:

  $locationProvider.html5Mode(true);

But why!?