Is there a way when you render a view several times so that each one is associated with a controller instance?
Pretty sure that this is not the right way to do this, so I am open to testimonies about how I should do this. But here is a precedent:
I have these routes:
FormBuilder.Router = Ember.Router.extend({
I am trying to list Field in Form in the Form route. Route for this:
form: Ember.Route.extend({ route: '/form/:form_id/edit', connectOutlets: function (router, form) { router.get('applicationController').connectOutlet('editForm', form); router.get('editFormController').connectOutlet( 'fieldsList', form.get('fields') ); },
EditFormView displays the edit_form_view template:
<h2>Editing form {{id}}</h2> {{view FormBuilder.AddFormFieldsView}} {{ outlet }}
In which we connect outlet to fieldsList . This displays the fields_list template and connects to the FieldsListController , which is a Field array.
{{! fields_list.handlebards }} <p>The form fields</p> <ul> {{#each content}} {{view FormBuilder.FieldView}} {{/each}} </ul>
So this displays the FieldView that uses the field_view template:
# {{publicName}} {{outlet}}
And here I have a problem. I cannot “plug in” this outlet because it is part of the FieldsListController .
I will describe what I am trying to do. I have it in my controller.
editField: Ember.Route.transitionTo('editOneField'), showField: Ember.Route.transitionTo('showOneField'), initialState: 'showOneField', editOneField: Ember.Route.extend({ connectOutlets: function (router, field) { router.get('fieldsListController').connectOutlet('editField', field); } }), showOneField: Ember.Route.extend({ connectOutlets: function (router, field) { router.get('fieldsListController').connectOutlet('showField', field); } })
This means that when rendering, the outlet view in field_view.handlebars will be associated with showField :
<pre>show a field yo :)</pre> <a {{action editField this}}>(edit)</a>
If I have only one field and click (edit) , it will switch the outlet connection to editField , which is what I'm trying to do for now. However, if there is more than 1 Field in my Form , when I click (edit) , it connects ALL editField to editField .
This makes sense because of this router.get('fieldsListController').connectOutlet('showField', field); , but I don’t know how to get the correct controller instance (and / or create a controller instance for each of FieldView s.
I'm completely lost right here. I am trying to make an “inline edition” without changing the whole view and it seems to be not good documentation / tutorials about having a collection of views, each of which has an independent outlet ...
Links to the entire code base and live online version are on top of the page.