Join the Stack Overflow Community
Stack Overflow is a community of 6.6 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I want to pass two values to new ui-view via params:

  • item id
  • list of objects

However, I'd like the new view to show only the id in the browser URL and not the stringified array of objects:

http://www.myapp.com/#/my-view/4

INSTEAD OF

http://www.myapp.com/#/my-view/4?flskdjalfjaewoijoijasdlfkjösldakjföliwejöorijo

Is it possible to either a) pass the array of objects hidden to the ui-view or b) pass both but hide the other from the browser URL?

I found something about the squash parameter, but couldn't get it to do what I'm trying.

Here's my view:

  $stateProvider
  .state('show', {
    url: "/show/{itemId}?{itemList}",
    views: {
      'mainView': {
        templateUrl: 'views/itemView.html',
        controller: 'showController',
        params: {
          itemList: {
            value: null,
            squash: true
          },

          itemId: -1
        }
      }
    }

How can I hide the list of objects from the URL, without hiding the id?

share|improve this question
    
If you are passing between angular views, why not make itemList a service instead of trying to pass it as a param? – Claies May 24 '16 at 23:24
    
Ah good idea... maybe this would be better especially when passing big data amounts. When passing data via params between views, are they always passed via URL or does ui router just display them there but pass it smarter behind the scenes? I'm just thinking if the url field length limitations come into play eventually...? – Juhana Pietari Lehtiniemi May 25 '16 at 9:30
up vote 1 down vote accepted

You are on the right path. To hide params you have to define them in params as you do, without squash.

Your example should look like:

  $stateProvider
  .state('show', {
    url: "/show?itemId",
    views: {
      'mainView': {
        templateUrl: 'views/itemView.html',
        controller: 'showController',
        params: {
          itemList: {
            value: null
          }
        }
      }
    }

See example: http://plnkr.co/edit/wEjwCVWMKTyuSdyLr0og?p=preview

share|improve this answer
    
Ah, thanks! Hmm, I can't get it work exactly yet, maybe it's because I have to use dynamic links so I can't use ui-sref in the source file. For some reason I can't see the itemList in the new state, only itemId is being passed. Here's how I'm passing it: <a ng-href="{{ $state.href('show', { itemList: filteredSearchResults, itemId: item.id }) }}"> The config is like this: url: "/show/{itemId}" and params: { itemList: null } – Juhana Pietari Lehtiniemi May 25 '16 at 9:26
    
You have to pass itemList as an object: <a ng-href="{{ $state.href('show', { itemList: {filteredSeachResults: filteredSearchResults}, itemId: item.id }) }}"> – przemod May 25 '16 at 10:03
    
if I mention null I am loosing its value. What if want to use it in the someState's controller? – Mr_Perfect Nov 28 '16 at 5:54

It's also possible doing that

SomeController:

$state.go(someState, {
 'itemId'   : item._id,
 'itemName' : item.title
});

SomeRoute function someRoute($stateProvider) {

    $stateProvider
      .state('someState', {
        url : '/:itemName',
        params : {
          'itemId' : null //hides itemId param
        }
      });
}

Output: .../itemnumber1

share|improve this answer
    
if I mention null I am loosing its value. What if want to use it in the someState's controller? – Mr_Perfect Nov 28 '16 at 5:53
    
They get just initialized to null. One you set them, you can easily access them through $state.params, $state.params.itemName. – AndreaM16 Nov 28 '16 at 8:33
    
How can I set them? – Mr_Perfect Nov 28 '16 at 8:37
    
Doing like I did in SomeController. If you do, var item = new Object(); item._id = "hey"; and item.title = "Johnny"; and Then you do that precise $state.go, you'll get .../hey/Johnny. – AndreaM16 Nov 28 '16 at 8:44
    
I am sending parameters using $state.go('myState', {name: 'ram', id: 2}) Now, state should be .state('myState', {url: '/home/:name', params: {id: null}}), if I mention null like this I am loosing its value. how to set it and how to use it in the controller? – Mr_Perfect Nov 28 '16 at 8:45

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.