title: ember.js list template keeps getting bigger on each visit
body: <p><strong>Summary</strong></p>
  
  <p>I have a problem with a list displayed by Ember which keeps displaying extra rows each time it is visited. The extra rows are duplicates of those which were initially displayed.</p>
  
  <p><strong>Detail</strong></p>
  
  <p>In an Emberjs 2.13.0 app I have a model that looks like this :</p>
  
  <p>import DS from 'ember-data';</p>
  
  <pre><code>export default DS.Model.extend({
      cceIdentifierParent: DS.attr('string'),
      cchCceIdParent: DS.attr('string'),
      nodeType: DS.attr('number')
  });
  </code></pre>
  
  <p>I have a route, 'diagcctreetoplevelonly', which looks like this :</p>
  
  <pre><code>import Ember from 'ember';
  
  export default Ember.Route.extend({
      model: function() {
          return this.store.findAll('diagcctreetoplevelonly');
    }
  });
  </code></pre>
  
  <p>And a template that looks like this :</p>
  
  <pre><code>{{diag-warningbanner}}
  {{#if model.length}}
    &lt;table&gt;
      &lt;thead&gt;
        &lt;tr&gt;
          &lt;th&gt;
              cceIdentifierParent
          &lt;/th&gt;
          &lt;th&gt;
              cchCceIdParent
          &lt;/th&gt;
          &lt;th&gt;
              nodeType          
          &lt;/th&gt;
        &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          {{#each model as |treenode|}}
             &lt;tr&gt;
                &lt;td&gt;
                  {{treenode.cceIdentifierParent}}
                &lt;/td&gt;
                &lt;td&gt;
                  {{treenode.cchCceIdParent}}
                &lt;/td&gt;
                &lt;td&gt;
                  {{treenode.nodeType}}
                &lt;/td&gt;
              &lt;/tr&gt;
          {{/each}}
      &lt;/tbody&gt;
    &lt;/table&gt;
  {{else}}
    &lt;p id="blankslate"&gt;
      No Tree Nodes found
    &lt;/p&gt;
  {{/if}}
  {{outlet}}
  </code></pre>
  
  <p>That works fine the first time that 'diagcctreetoplevelonly' is visited - 12 rows are rendered - but on subsequent visits (without the underlying data having changed) the table rendered by the template has 12 extra rows for each time it has been visited.</p>
  
  <p>Can anyone explain what i'm doing wrong ? Thank you.</p>
  
  <hr>
  
  <p><strong>EDIT</strong>: Thanks to the input from @Jeff and @Subtletree I was able to resolve this.</p>
  
  <p>The problem was that the data returned had no 'id' attribute and when I created one the problem went away.</p>
  
  <p>Because of the peculiar nature of the data it didn't actually matter what the id was and I didn't want to make changes to the backend so I created an id dynamically once the data had arrived on the client by creating a model level serializer and overriding the <code>extractId</code> method like this :</p>
  
  <pre><code>import ApplicationSerializer from './application';
  
  export default ApplicationSerializer.extend({
      extractId(modelClass, resourceHash) {
          var arrId = [];
          arrId.push(resourceHash['attributes']['cceIdentifierParent']);
          arrId.push(resourceHash['attributes']['cchCceIdParent']);
          arrId.push(resourceHash['attributes']['nodeType']);
          var id = arrId.join('|');
          return id == null || id === '' ? null : id+'';
    },
  });
  </code></pre>
  
  <p>It wouldn't have worked in all (perhaps most ?) situations but for my case this was good enough and resolved the problem.</p>
  
  <p>To provide credit where it's due I got the idea for how to do this from the answer by @Casey here <a href="https://stackoverflow.com/a/35738573/364088">https://stackoverflow.com/a/35738573/364088</a> .</p>