title: vue js 2 way data binding not updating
body: <p>so i have a quick Vue JS question that seems very strange, i have the following</p>
  
  <pre><code>var home = new Vue({
   el: '#home',
   data:{
      title: 'welcome to the app'
   }
  });
  </code></pre>
  
  <p>Which works fine, and title in my HTML gets updated fine...</p>
  
  <p>now when i do this</p>
  
  <pre><code>home.$data.title = 'this is the new title'
  </code></pre>
  
  <p>the html </p>
  
  <pre><code>  &lt;div class="app-topbar"&gt;{{title | uppercase}}&lt;/div&gt;
  </code></pre>
  
  <p>Does not update, do i have to force an update to the data binding or something?</p>
  
  <p>Thanks Sam</p>