Passing routes to components

1

I was wondering whether someone had a better plan for this problem.

I often find myself buidling components to list some data. For instance, they will look like:
{{article-list articles=section.articles delete=(action "delete")}}

The idea is I have several places that need to list articles, and they can do so neatly, using the dedicated component. So far so good.

Now, this listing often includes some actions and links. For instance, every line could include a view, rename, delete action. Such actions go up flawlessly… until some of them need to trigger routes.

How would I do that? I came up with the following solutions, but none seems very clean:

  • Forbid links. If triggering a route is needed, then pass an action from the controller, that will do this.transitionToRoute. Feels clumsy, but this is what I end up doing atm.
  • Pass the route name to the component. However, that means the component must be aware it is a route name and not an action.
  • I posted https://github.com/emberjs/rfcs/issues/105. I believe this would solve the issue by allowing passing (link-to) closures that would behave as actions.

But maybe there is another, better option?

2

I think making your component route aware is a bad idea.

I myself don’t really use link-to and always use actions. Could you explain why that feels clumsy to you?

Also be aware you can have actions in your routes. When an action isn’t caught in your controller it bubbles up through the active routes. I have a feeling you think it’s clumsy because you see yourself redefining the same action again and again in different controllers.

1 Like
3

I think making your component route aware is a bad idea.

I believe so too.

Thing is, you cannot have actions in your routes when using the new action closure syntax (the (action 'somename') part), because the closure version of the action helpers will only look for actions in the controller. Actually I end up having so many forwarding stubs that I made a forward function that returns a forwarding stub…

Otherwise I could use the old syntax, name-based, that bubbles to the routes, but then I would have to redefine the actions again and again in the nested components. That’s actually the very reason the new syntax was introduced, to cut off the forwarding boilerplate in nested component hierarchies.

4

@spectras You would only have to bubble from the outer component of a nested group of components. You can use closure actions to wire together nested components and bubbling to send messages out of that nested group (from the outermost component) that should be handled on the route.