Can't get param values through $stateParams

ionic-v1
1

i can’t get param values through $stateParams, what i get is always undefined. Is there any mistake in the below codes?

the controllers codes:

  .controller('DywzCtrl', function ($scope, $state) {
        $scope.queryWeizhang = function () {
            $state.go("tabs.result",  {a:1, b:2});
        }
    })
    .controller('ResultCtrl', function ($scope, $stateParams) {
        alert($stateParams.a);
    })

the stateProvider:

$stateProvider
            .state('tabs', {
                url: "/tab",
                abstract: true,
                templateUrl: "tabs.html"
            })
            .state('tabs.search', {
                url: "/search",
                views: {
                    'search-tab': {
                        controller: 'DywzCtrl',
                        templateUrl: "search.html"
                    }
                }
            })
            .state('tabs.result', {
                url: "/result",
                views: {
                    'search-tab' :{
                        templateUrl: "result.html",
                        controller: 'ResultCtrl'
                    }
                }
            })
});
2

I config the same way with sample and it works:

.state('tab.search', {
  url: '/search/:searchKeyword',
  views: {
    'tab-search': {
      templateUrl: 'templates/tab-search.html',
      controller: 'ResultCtrl'
    }
  }
})

Note: ‘/search/:searchKeyword’. And in controller, I can get it by:

alert($stateParams.searchKeyword);
1 Like
3

i have more than one param to pass. And i want to pass them with state.go(toState, toParams) other than through url.
Angular-ui-router has the explanation : https://github.com/angular-ui/ui-router/wiki/Quick-Reference#toparams

Isn’t the toParams used to pass param into $stateParams of the toState?

4

@guangwen I have the same issue now. How did you fix it?

5

i didn’t fix it. to get rid of this problem，i use modal to show result form. then they are in the same scope.

6

Anyways, I figured out the solution. Thanks!

7

good for you. can you share the codes how you did that?

8

Sure. Here it is…

.state('app.details', {
        url: '/itemdetails?param1&param2',
        views: {
          'menuContent': {
            templateUrl: 'templates/itemdetails.html',
            controller: 'itemDetailsCtrl'
          }
        }
      })

then, you can call $state.go and pass params in the second argument as shown below -

$state.go('app.details', {param1: "xyz", param2: "abc"});

Hope this helps…

1 Like
9

ok, i will test the solution when i have time. thanks a lot

10

url: ‘/itemdetails/:param1/:param2’ does the job the way you should expect it

11

Check the order of your injected services. This fixed it for me

Also, another mistake i was making was in the case of the parameters name, so keep in mind that parameter names are case sensitive too.