Handle actions, not a router

I have a view that has extensible / compressible content that I would like to switch by clicking on a table row. Prior to pre1.0, I had this in a template:

<tr {{action "expand"}}> 

which was previously handled on my view:

 App.ContentRowView = Em.View.extend({ templateName: 'ember/templates/content/row', expand: function() { this.set('isExpanded', !this.get('isExpanded')); }, isExpanded: false }); 

However, after upgrading to version 1.0, the action is now transmitted directly by the router. This makes sense in many situations, but in this case, the extension is indeed a concern. I tried just replacing this with a click event handler with no luck.

Is there any best practice on how to handle a view-related event like this with pre1.0?

+7
source share
3 answers

Outdated answer


Even if @ outside2344's answer works, I think this is not entirely correct. Indeed parentView does not represent the view, but parentView is its parentView. Starting from 1.0-pre, views retain their context, so in the this template represents parentView, parentView represents parentView.parentView , and view represents the current view. Here are the tablets to illustrate this: http://jsfiddle.net/Sly7/cnmJa/

For me, the answer is {{action expand target="view"}}

EDIT (reply to @Gal Ben-Haim)

Action assistants behave a little differently in a router-based application. Quote from the documentation:

In router-driven applications, if the action is not intercepted by the view , this event will bubble up to the route in which the view was displayed. If this route is a subset of another route, the transition will look there until the definition of the top-level route, our ΓΌber-container: root.

This bubbling effect allows some activities to remain closed. If certain transitions should be available only for certain sub-states, place the transition in a sub-state and you have reached a certain level of coverage.

Basically, for me this means that in applications with router support , if you do not explicitly define the target in the action assistant, it is sent to the router.


Updated Answer

I think that now guides answer this question very well. see http://emberjs.com/guides/templates/actions/#toc_specifying-a-target

+20
source

In pre1.0, you can make the view field an action by adding target = "parentView" to the action:

 {{action "expand" target="parentView"}} 
+1
source

By default, the view hierarchy does not bubble in the hierarchy. You can change this (although I can’t say I recommend it):

 (function() { Ember.View.reopen({ // Let actions bubble to parentView by default. target: function() { return this.get('parentView'); }.property('parentView') }); })(); 
+1
source

All Articles