# Template node with ng-repeat won't show array items

**URL:** <https://discourse.nodered.org/t/template-node-with-ng-repeat-wont-show-array-items/40989>\
**Category:** Dashboard\
**Created:** [14 February 2021 22:33 UTC](https://discourse.nodered.org/t/template-node-with-ng-repeat-wont-show-array-items/40989 "2021-02-14T22:33:22Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![clickworkorange](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/clickworkorange/32/12109_2.png) [@clickworkorange](https://discourse.nodered.org/u/clickworkorange)\
**Post date:** [14 February 2021 22:33 UTC](https://discourse.nodered.org/t/template-node-with-ng-repeat-wont-show-array-items/40989/1 "2021-02-14T22:33:22Z")

</div>

I've been struggling with something which should be very simple; a button that sends a 1-dimensional array to a template node, which shows the array values:

![Screenshot_2021-02-14_22-19-43](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/e/2e9baea1db6731a8331ee688508a4505f01c131a.png)

The button sends `["OH NO!","Hello World!","Hello World!","Hello World!","OH NO!"]`, which shows up in debug as an array with five items:

![Screenshot_2021-02-14_22-31-14](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/0/30a1eeb14a811005ef8da0404f4b2501537a1b46.png)

The template node contains:

```auto
<table>
    <tr ng-repeat="value in msg.payload">
        <td>{{value}}</td>
    </tr>
</table>

```

But _nothing_ appears - and I've double checked in the HTML inspector that there are no hidden elements. No errors, nothing. But if I change the button payload to `["one","two","three"]` it works every time. Driving me nuts it is - what am I missing here!?

[ng-repeat-mystery.json](https://discourse.nodered.org/uploads/short-url/A5yCLan8GG30nTwcxHt75bWSZuZ.json) (1.7 KB)

---

<div class="post-metadata">

**Author:** ![clickworkorange](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/clickworkorange/32/12109_2.png) [@clickworkorange](https://discourse.nodered.org/u/clickworkorange)\
**Post date:** [14 February 2021 23:22 UTC](https://discourse.nodered.org/t/template-node-with-ng-repeat-wont-show-array-items/40989/4 "2021-02-14T23:22:18Z")

</div>

Ok, it's the repetition. The array cannot contain the same value twice. `["a","a","a"]` fails silently, `["a","b","c"]` works. Why is this?

**Edit:** [Error: ngRepeat:dupes - Duplicate Key in Repeater](https://docs.angularjs.org/error/ngRepeat/dupes)

> Duplicate keys are banned because AngularJS uses keys to associate DOM nodes with items.

Wow. Funny how I've never run into this before - I've been tinkering w. Node-RED on & off for _years_. A somewhat surprising feature of Angular.JS which probably should be mentioned in any `ng-repeat` tuts & boilerplate. Might save someone else the headache. The solution (if your array may contain duplicate values) is to tell Angular to generate DOM references by index instead:

```auto
<table>
    <tr ng-repeat="value in msg.payload track by $index">
        <td>{{value}}</td>
    </tr>
</table>

```

**Edit 2:** And of course all this can be seen in the JS error console, plain as day - the error message even includes a link to the article on Angular's website... Doh!

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [28 February 2021 23:22 UTC](https://discourse.nodered.org/t/template-node-with-ng-repeat-wont-show-array-items/40989/5 "2021-02-28T23:22:32Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.
