Rendering a view within another view and using action target

I want to accomplish the following:

  • Use an ParentView
  • Use a SubView (let’s call it that way)
  • render the SubView within the ParentView, preferably using {{view SubView}} within the template
  • use actions within the ParentView that target the SubView.

I’ve been trying what is metioned here with Relative Paths in the documentation but I did not get it to work using target=“view.subView” and a property subView within the ParentView.

Anyone tried this before? Got a working example?

You have me up until the last bullet: “use actions within the ParentView that target the SubView.”

Here is an example of what I think you want to do Ember Latest - JSFiddle - Code Playground

I want the opposite of what your code describes:

Within the ParentView template an {{action}} should be defined with the target the subView. Is that possible?

Have you tried using {{view App.SomeView viewName='myChildView'}} to name your view? It creates a property with that name on the parent view that references the child view instance. I can’t seem to find this in the guides or documentation, but I’ve used this a number of times.

1 Like

Thanks, that is perfectly what I wanted to do. Now I can keep my code separate and clean.

I still seem to have 2 problems:

  • I need to provide a templateName within the SubView, while I did not expect that and expected it to take the template itself
  • The SubView doesn’t seem to have a controller.

This seems to be related to: But i want it to use it’s own controller.

So I would like to use render, but can you then still use the viewName?

I’m not sure I understand completely, but have you tried using a Component instead of a View? A Component is sort of used as its own controller, so you don’t need a separate controller. Also, since Ember.Component inherits from Ember.View, you can do all the things you do with a view, like use viewName. I don’t know if that works using render.

Also, I’m not sure if this works, but templateName is just a property, so it may be possible to specify it like any other property for each instance in your handlebars.