ember: Strange behaviour on {{#each ..}} with itemController

0
votes

At one of our many emberjs-apps I'm running into problems while updating from an old AppKit structure to ember-cli 0.2.6 with ember 1.12.1. In this project every {{#each item in myarray itemController="my-item"}}raises:

Uncaught Error: Assertion Failed: The value that #each loops over must be an Array. You passed monopoto@controller:array:, but it should have been an ArrayController

To get to the essence I simplified things to:

foo.js:

export default Ember.Controller.extend({
   myData: [1,2,3]
});

foo.hbs:

{{#each item in myData}}
  {{item}}
{{/each}}

This works fine and delivers: 123

If I add an item controller like this:

foo-item.js:

export default Ember.Controller.extend({
   foo: function(){
      return "bar" + this.get("model");
   }.property("model")
});

and modify the {{each}} to use that controller:

{{#each item in myData itemController="foo-item"}}
  {{item.foo}}
{{/each}}

the error occurs.

I did the same on another ember project and everything works fine with using an item-controller like this. I testet this with serveral ember versions on both projects. One fails always and the other one works always. Any Ideas?

2
ember.jsember-cli
I just found out, that ember-disable-proxy-controllers is responsible for that effect. – Stick
You should refactor your code to not use itemControllers, which are basically a vestige of an old ArrayController type world. Write a component to handle element in your model/data. – user663031

2 Answers

0
votes

A controller can't take a number. It can only take objects. This should work.

export default Ember.Controller.extend({
   myData: [{ value: 1 },{ value: 2 },{ value: 3 }]
});
0
votes

myData is attached to your controller instance, not the array controller. If I understand correctly your problem you need to do something like:

{{#each ctl in controller itemController="foo-item"}}
  {{ctl.foo}}
{{/each}}

Let me know if this solves your issue.