0

What i am trying to do:

I have a ListView (or rather an accordion) which contains several items (for simplicity lets assume those have a unique id and a name). For each item i want to include a link to a a detail-view to show and edit the properties (except for the id) of that item.

Googling for this returns several results like for example: Passing data between controllers in Angular JS?

and from what i understand the suggested solutions include:

ng-init: (see Can you pass parameters to an AngularJS controller on creation?)

I could initialize a parameter for each item in my List using ng-init inside of the ng-repeat. However by now the angular-documentation advise against this:

The only appropriate use of ngInit for aliasing special properties of ngRepeat, as seen in the demo below. Besides this case, you should use controllers rather than ngInit to initialize values on a scope.

service:

It is suggested to use services to share global variables between controllers. I am already doing that by using a service to hold my list of items and use calls to the service to add/delete or change the items. I also implemented a getItem(id) method which i would like to call from the controller of my detail-view. But to do that i need to know the id of the item first!

passing values via $routeParams

The Angular Phonecat Tutorial solves a similar problem by passing parameters via the $routeParams. While this would work, this means I have to include the id of my item in the link to the detail-view. A user could easily change the link and end up in a detail view for a completely different item. If possible, i would rather not expose the internal id in the link to my detail-view!

This seems like a quite common requirement. Is there any best-practice that i am missing?

Community
  • 1
  • 1
H W
  • 2,556
  • 3
  • 21
  • 45
  • 1
    "A user could easily change the link and end up in a detail view for a completely different item" This sounds like security by obscurity. Stay away from that! I would suggest using a combination of $routeParams and service. – jao Sep 24 '15 at 11:33
  • Have you thought about listening on the creating event ``$on`` from the first controller and bypass the data as a parameter into the second controller? – dude Sep 24 '15 at 11:34
  • @julmot i don't quite understand what you mean. When loading my first controller, i load a list which contains ALL items. For each item i need an individual link to the detailpage which also passes the `id` as parameter. So my question stay the same: how do i actually pass the parameter to the second controller? – H W Sep 24 '15 at 11:38
  • @jao: thanks, i am currently implementing this. I just wanted to know if that is actually the way to go and appreciate any other suggestions. – H W Sep 24 '15 at 11:41
  • WIthout the actual code the question is too vague. There's no 'best', it always depends on the actual code and the preferences. – Estus Flask Sep 24 '15 at 11:45
  • use a uuid system that isn't just incremental integer. People won't guess those – charlietfl Sep 24 '15 at 12:02

1 Answers1

1

You have two real alternatives (that you have identified):

  • Use a service
  • Pass the information as part of a url

Both are technically correct and viable but my preference from a semantic and state point of view would be to use a url.

Since you are supplying a clickable link it makes sense that you are linking to something that is linkable (i.e. an item or state that can be identified by a unique url). If you believe an open accordion item to be more an item of state (as opposed to a page) then you could look into ui-router: https://github.com/angular-ui/ui-router

I'm not sure why you are averse to having item IDs in the url. After all anyone that's interested can see any information in the UI with developer tools. If you don't want database schema information in the UI then there are various methods of ID obfuscation to address this.

James Drummond
  • 125
  • 7