{{control}} inside {{each}} is broken

[ahawkins]

Here's a completely feasible use case: you have an array that needs to be rendered as controls. You write this template:

{{#each widgets in controller}}
  {{control "widget" widget}}
{{/each}}

The problem is the same controller is used for every widget. Passing in a different controlID option each time solves this problem. Perhaps controlID should be path that we can we make it a CP on the view or on the controller.

Edit: I've provided a fiddle http://jsfiddle.net/twinturbo/cH27A/. Seems it's more related to ArrayProxy then each. A loop of simple Ember.Objects works correctly.

[schmidp]

I noticed the same thing and was able to get it working by registering the controller as a singleton right after Ember.Application.create.
E.g:

Reader = Ember.Application.create({});
Reader.register('controller:index_image', Reader.IndexImageController, {singleton: false });

[emvu]

Also {{control}} inside {{collection}} has the same problem. @schmidp solution works great!

[ahawkins]

@emvu @schmidp the other solution is a unique controlID for everything. Either way, this is a bug and a common use case--or perhaps a misuse case. @wycats / core team needs to chime in on this one.

[bnetter]

I tried to set controlID when using {{control}}, doesn't work for me, I still have this issue.

{{#each widgets in controller}}
  {{control "widget" widgets controlID="{{widget.id}}"}}
{{/each}}

Is there something wrong with my source code?
Besides that, setting the controller as not being a singleton works well.

[ahawkins]

ya, you can't use {{ ... }} inside another {{ ... }}. You have to
create a helper to generate a unique controlID.

On Thu, Feb 14, 2013 at 2:52 PM, Benjamin Netter
notifications@github.comwrote:

I tried to set controlID when using {{control}}, doesn't work for me, I
see have this issue.

{{#each widgets in controller}}
{{control "widget" widget controlID="{{widget.id}}"}}{{/each}}

Is there something wrong my source code?

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/1990#issuecomment-13549655.

[darthdeus]

Is there any other workaround for this?

[ryanjm]

+1 any work around? Additionally, how do you properly set the flag so you can use control?

[schmidp]

I did it like this:

window.ENV = window.ENV || {};
window.ENV["EXPERIMENTAL_CONTROL_HELPER"] = true;

But before loading ember.js

On Feb 20, 2013, at 8:34 PM, Ryan Mathews notifications@github.com wrote:

+1 any work around? Additionally, how do you properly set the flag so you can use control?

—
Reply to this email directly or view it on GitHub.

[ryanjm]

Thanks @schmidp that let me be able to start using it and see the problem as mentioned above.

I wish there was more information about how to do reusable views. I've seen two potential options (control and view) but I can't get anything to work.

Update
I was able to use the singleton solution to solve it. I do hope there will be better options in the future.

[schmidp]

My workaround does not seem to work anymore.

I think {{control}} should support non singleton controllers as {{render}} does, but I don't think I know enough about ember.js to implement this.

@wycats: do you have some insights or plans with {{control}} regarding this issue?