Rathma
Rathma

Reputation: 1303

ui-sref params option with $state.href not working as expected

I have a state definition like this:

 $stateProvider.state('password', {
    url: '/password',
    templateUrl: 'password.html',
    controller: 'PasswordController',
    controllerAs: 'ctrl',
    params: {
        accountNumber: {
            value: null,
            squash: true
        }
    },               
});

I need to reference this state with its href rather than using ui-serif directive, How can I set params.accountNumber inside href?

This doesn't work:

$state.href('password', {accountNumber: $scope.accountNumber})

When I change this line url: '/password', to ` url: '/password?accoutNumber', and remove this part

params: {
    accountNumber: {
        value: null,
        squash: true
    }
}, 

$state.href works just fine.

Upvotes: 2

Views: 6375

Answers (1)

Radim Köhler
Radim Köhler

Reputation: 123861

To be able to generate URL with $state.href and pass parameter...

  • such parameter must be part of url definition
  • declaring it just in params: {} will result in href - not containing it, not passing it

there is adjusted state definition:

  .state('password', {
    url: '/password/:accountNumber',
    templateUrl: 'password.html',
    controller: 'PasswordController',
    controllerAs: 'ctrl',
    params: {
        accountNumber: {
            value: null,
            squash: true
        },
      },               
  });

There is a working plunker

ORIGINAL part, related to typo

The $state.href() call seems to be ok... just a state definition could be wrong:

$stateProvider.state('password', {
    //Url: '/password',
    url: '/password',
    ...

The url setting is case sensitive. See state.href doc here:

href(stateOrName, params, options)

Upvotes: 3

Related Questions