AngularJS router - doesn't work the second time

Question

In this plunk I have a ui-router $state.goto that only works the first time, even though I'm incrementing a seq variable to force the reload. See that the time stamp doesn't change. What's wrong with this code?

HTML

<body ng-controller="MyCtrl">
    <button ng-click="goto()">Go to state</button>
    <div ui-view=""></div>
</body>

State HTML

  <div>
    {{time1}}
  </div>

Javascript

var app = angular.module("app", ['ui.router']);

app.controller('MyCtrl', function($scope,$state) {

var seq = 0;

$scope.goto = function(){

    alert('about to go to state - ' + seq) ;

        var params = { 
                seq: seq++ 
               };

        $state.go ( 'state1', params );

  };
});

app.controller('state1Ctrl', function($scope) {

      $scope.time1 = new Date();

});


app.config(function($stateProvider) {

  $stateProvider
    .state('state1', {
         templateUrl: 'state1.html',
         controller: 'state1Ctrl'
    });

});

You are passing a parameter to your state but in your url u don't specify one. — levi
– levi, Commented Mar 2, 2015 at 16:03

Tom · Accepted Answer · 2015-03-02 16:24:43Z

4

Since you're not actually changing state (i.e., you're hitting state1 every time, just with a different parameter), you have to pass the third options parameter with {reload: true}

$state.go('state1', params, {reload: true});

Your plnkr, updated

See the documentation for $state.go(to, params, options)

Edit (to make this answer correct based on the comments we have below)

You aren't including the params in the actual state, so it's not listening for them, hence when you send them it doesn't automatically trigger a reload. Your state should be:

$stateProvider
  .state('state1', {
    templateUrl: 'state1.html',
    controller: 'state1ctrl',
    params: {
      seq: {}
    }
  });

Here, the $stateProvider automatically sets reloadOnSearch = true, you could do the opposite of what you're asking by using a third parameter in your state, reloadOnSearch: false

edited Mar 2, 2015 at 16:24

answered Mar 2, 2015 at 16:03

Tom

7,7401 gold badge26 silver badges49 bronze badges

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

3 Comments

ps0604 Over a year ago

I'm trying to avoid reload:true

Tom Over a year ago

So, your current state doesn't actually listen for any parameters (but you're passing it parameters), if it did listen for parameters, it would automatically reloadOnSearch

Sohail Yasmin Over a year ago

i was also missing {reload: true} it saves my live thank you

ps0604 · Accepted Answer · 2015-03-02 16:13:20Z

0

The params keyword is missing, needs to be declared in $stateProvider when you use parameters:

 $stateProvider
    .state('state1', {
         templateUrl: 'state1.html',
         params: { 'seq': null },
         controller: 'state1Ctrl'
    });

answered Mar 2, 2015 at 16:13

ps0604

1,20728 gold badges157 silver badges379 bronze badges

Collectives™ on Stack Overflow

AngularJS router - doesn't work the second time

2 Answers 2

3 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Related