Use angular ui route to pass query parameters

Question

I'm using Angular ui route and I'm trying to pass query parameters but it doesn't work. I have followed the official wiki.

In the view I have the following code very simple

<div ng-controller="MainController">
  <a ng-href="#/foo/bar?param={{make}}"><li>{{make}}</li></a>
</div>

and this is the config

function config($stateProvider, $urlRouterProvider) {
    $stateProvider
      .state('foo', {
        url: '/foo',
        templateUrl: '/partials/foo.html',
        controller: 'MainController'
      })
      .state('foo.bar', {
        url: '/bar?param',
        templateUrl: 'partials/foo.bar.html',
        controller: 'SecondaryController'
      });
  }

but when I click on the link in the view the url I get it is what I get but the route doesn't receive the request.

Pankaj Parkar · Accepted Answer · 2015-04-10 18:28:46Z

4

Use ui-sref directive to generate href link

Markup

<div ng-controller="MainController">
  <a ui-sref="foo.bar({param: make})"><li>{{make}}</li></a>
</div>

edited Apr 10, 2015 at 18:28

answered Apr 10, 2015 at 18:19

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

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

14 Comments

Mazzy Over a year ago

Already done that as suggested to this post stackoverflow.com/questions/25569346/…

Mazzy Over a year ago

Unfortunately the make contains some spaces and I got errors

Pankaj Parkar Over a year ago

@Mazzy what do you mean by make contains some space?

Mazzy Over a year ago

make could be for example `The Facebook'. As you might see there are space

Pankaj Parkar Over a year ago

@Mazzy you should look at this stackoverflow.com/questions/28639852/… where I solved the problem what you are getting

|

Collectives™ on Stack Overflow

Use angular ui route to pass query parameters

1 Answer 1

14 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

14 Comments

Linked

Related