title: Why doesn't Ember model update?
body: <p>My goal is to simply update append a number to an array model. This should create a new HTML element due to the iterator I have used in the template.</p>
  
  <p>My action does get called, but the model doesn't really update.</p>
  
  <p>Here is my directory structure:</p>
  
  <pre><code>- app
    - routes
      - compare.js
    - templates
      - compare.hbs
      - application.hbs
    - app.js
    - index.html
    - router.js
  </code></pre>
  
  <p>compare.hbs:</p>
  
  <pre><code>&lt;div id="container"&gt;
    &lt;form method="post" name="login" {{action "submit" on="submit"}}&gt;
        &lt;p&gt;
            Member ID
        &lt;/p&gt;
      &lt;p&gt; {{input id="member-id" type="text"}} &lt;input type="submit" value="Search"&gt;&lt;/p&gt;
    &lt;/form&gt;
    &lt;div id="results"&gt;
        {{#each model as |result|}}
        &lt;p&gt;{{ result }}&lt;/p&gt;
        {{/each}}
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>router.js</p>
  
  <pre><code>import Ember from 'ember';
  import config from './config/environment';
  
  var Router = Ember.Router.extend({
    location: config.locationType
  });
  
  Router.map(function() {
      this.route('compare');
  });
  
  export default Router;
  </code></pre>
  
  <p>compare.js</p>
  
  <pre><code>import Ember from 'ember';
  
  let results = [12, 34, 56];
  
  export default Ember.Route.extend({
    model: function() {
      return results;
    },
    actions: {
      submit: function() {
        results.push(123);
        this.get('model').push(123);
        this.refresh();
      }
    }
  });
  </code></pre>
  
  <p>What is the problem?</p>