Ember 1.13 each loop in each loop

Question

As stated here, Ember 1.13 needs a key for the {{each}} helper. Since Ember 1.13.2 the default key is @identity.

Now I am trying to fix my code, I have an each loop nested inside another (piece of code that shows an calendar). I get the following error:

Uncaught Error: Duplicate key found ('(null)') for '{{each}}' helper, please use a unique key or switch to '{{#each model key="@index"}}{{/each}}'.

But even if I add a @guid as key, the error is still shown. Code:

{{#each weeks key="@guid" as |week|}}
    <tr>
        {{#each week key="@guid" as |day|}}
            <td class="day"></td>
        {{/each}}
    </tr>
{{/each}}

I don't understand that. As @guid should create an unique identifier for each object, why do I still get this duplicate key found error?

EDIT: My assumption that Duplicate key found had anything to do with nested each loops was plainly wrong. After trying to build a fiddle as Kitler proposed, I did understand my problem (see the answer).

That question you have linked to states **@guid and @item are deprecated in favor of the new default.** — Craicerjack, Jul 17 '15 at 09:00
That's just my question, the `new default` does not work if you have a loop wrapped inside a loop. If you got a 'normal' loop, the default makes it easier (because you don't have to do anything). — Jacob van Lingen, Jul 17 '15 at 09:03
Can you setup your example in a [bin](http://emberjs.jsbin.com/)? — Patsy Issa, Jul 17 '15 at 12:43
I'm getting the same error `Error: Duplicate key found ('ember850') for '{{each}}' helper, please use a unique key or switch to '{{#each model key="@index"}}{{/each}}'` when upgrading from 1.12.1 to 1.13.5 — pixelhandler, Jul 21 '15 at 21:14
@pixelhandler: I think you provided an object twice (or more) in your list, so Ember will generate the same key for the same object. See my answer below, actually the same kind of problem. — Jacob van Lingen, Jul 22 '15 at 14:13

score 2 · Accepted Answer · answered Jul 24 '15 at 04:04

2

This is a regression in v1.13.x and expected to be resolved in a patch, perhaps v1.13.6

This is the closed issue : https://github.com/emberjs/ember.js/issues/11549

And the merged pull request: https://github.com/emberjs/ember.js/pull/11861

answered Jul 24 '15 at 04:04

pixelhandler

615
4
11

Confirmation: Ember 1.13.6 does indeed fix this issue: https://github.com/emberjs/ember.js/releases/tag/v1.13.6 -> #11861 [BUGFIX] Update HTMLBars to allow duplicate {{each}} keys. – Jacob van Lingen Aug 03 '15 at 06:40

Jacob van Lingen · Answer 2 · 2015-07-22T14:18:19.323

After trial and error, I did understand what was causing the error.

Cause
Some items in my loop where null. Ember 1.13.x and up tries to add an id for every item. As null means nothing, the first null-item get key null, as Ember provides a nothing-key to nothing. The following null-items also get a nothing-key as Ember does that for every null-item.

Error
Because the helper requires a unique id for every item, Ember throws an Duplicate key found ('(null)') error; telling the programmer some items has the same id.

Solution
Fixing this is quite easy, just provide an empty object ({}) instead of null. As one empty object is not the same as another empty object, Ember will create an unique id for every empty object!

Code example: Bin.

Ember 1.13 each loop in each loop

2 Answers2