Navigating through states, url not changing the first time.

[ghost]

I have the following states:

.state('app', {
      abstract: true,
      template: '<div ui-view/>'
    })
    .state('app.Home', {
      url: '/',
      breadcrumb: 'Home',
      controller: 'HomeController',
      templateUrl: 'templates/entities/landing.vm'
    })
    .state('app.Entities', {
      abstract: true,
      url: '/entitites',
      breadcrumb: 'Entities',
      template: '<div ui-view/>'
    });
.state('app.Entities.Channel', {
      breadcrumb: 'Channel',
      url: '/channel',
      controller: 'ChannelController',
      resolve: {
        channelCollection: function (ChannelFactory) {
          return ChannelFactory.getCollection();
        }
      },
      templateUrl: 'templates/entities/channel/main.vm'
    })
.state('app.Entities.Concept', {
      breadcrumb: 'Concept',
      url: '/concept',
      resolve: {
        conceptCollection: function (ConceptFactory) {
          return ConceptFactory.getCollection();
        }
      },
      controller: 'ConceptController',
      templateUrl: 'templates/entities/concept/main.vm'
    });

When I switch between states using:

<li ui-sref-active="active">
        <a ui-sref="app.Entities.Channel" title="Channel">
                <span class="menu-item-parent">{{'menu.entities.channel' | translate }}</span>
        </a>
</li>
<li ui-sref-active="active">
        <a ui-sref="app.Entities.Concept" title="Concept in store">
                <span class="menu-item-parent">{{'menu.entities.concept' | translate }}</span>
        </a>
</li>

I am using angular-translate with the async partial loader (by module) which loads the translations each time a module loads.

When I click on various menù items, the first time, url doesn't get updated. If i click again, it updates. Just the first time though, if I navigate to another state and then come back to the previous state, the url changes....

The issue came up after adding the angular-translate. I am not sure if the problem is related to ui.router or angular-translate or mine.

Maybe you guys can help me out.

Modules versions: ui.router: latest 0.2.11 angular: 1.2.26 angular-translate: 2.4.2 (if it helps) UI-Router-Breadcrumbs: latest , i think 0.0.2

[christopherthielen]

http://bit.ly/UIR-SOF

http://bit.ly/UIR-Plunk

Sorry, we don't have the manpower to try to reproduce your test scenario. Either report a specific bug and reproduce it in a plunkr, or ask for help on StackOverflow.

[eduardmartinez]

@ionut-tanasa I have the same problem in my project but I'm not using angular-translate. Did you solve your problem?

[nickelozz]

+1 I'm having the same issue...any luck trying to determine what causes such behavior?

[ghost]

@eduardmartinez Eventually I dumped the async loading of the language files. Didn't have time to further investigate it.

It was happening when I was trying to load the files upon module "init", pass me the term.

[eduardmartinez]

@ionut-tanasa Hey, I solved my issue. It was a $http promise I was using in a directive. So, the issue appears to be with promises or async loadings.