CODEWITHSUNDEEP
angularjsangular-ui-router
ps0604
ps0604

Reputation: 1081

AngularJS router - doesn't work the second time

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

});

Upvotes: 4

Views: 1942

Answers (2)

Tom
Tom

Reputation: 7740

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

Upvotes: 4

ps0604
ps0604

Reputation: 1081

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

Upvotes: 0

Related Questions