title: vue.js is not updating the DOM after updating the array
body: <p>I read a list of items via AJAX and push it into a data Array:</p>
  
  <pre><code>loadSparepartFiles: function() {
      var vm = this;
      vm.activeSparepart.attachments = [];
      ajaxApi.loadJson('spareparts/sparepart/getFiles/'+vm.activeSparepartId, function(data) {
          for (var i = 0; i &lt; data.files.length; i++) {
              vm.activeSparepart.attachments.push({
                  filename: data.files[i]
              });
          }
      });
  },
  </code></pre>
  
  <p>In the Vue devTools in Chrome I can see the updated data array, but the DOM list is still empty.</p>
  
  <p>The template:</p>
  
  <pre><code>&lt;div v-for="file in activeSparepart.attachments" class="uk-width-1-2 uk-margin-bottom"&gt;
      &lt;a href="{{ baseUrl }}/download/sparepart/{{ activeSparepartId }}/{{ file.filename }}" target="hidden-frame" class="block-link"&gt;
          &lt;i class="delete uk-icon-remove"&gt;&lt;/i&gt;
          &lt;i class="icon uk-icon-image"&gt;&lt;/i&gt;
          &lt;span class="title"&gt;
              {{ file.filename }}
          &lt;/span&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The <code>activeSparepart</code> Object is initialised here:</p>
  
  <pre><code>resetSparepart: function() {
      this.activeSparepart = {
          alternates: [],
          locations: [],
          logs: [],
          usages: [],
          vendors: [],
          sparepart: {},
          attachments: []
      };
      this.activeSparepartId = 'new';
  },
  </code></pre>
  
  <p>Vue devTools shows the following:</p>
  
  <p><a href="https://i.stack.imgur.com/beSEv.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/beSEv.jpg" alt=""></a></p>