title: Displaying HTML if data is empty
body: <p>HTML:</p>
  
  <pre><code>&lt;div id="demo"&gt;
      &lt;h1&gt;{{title | uppercase}}&lt;/h1&gt;
      &lt;ul&gt;
          &lt;li v-repeat="todos" v-on="click: done = !done" class="{{done ? 'done' : ''}}"&gt;
              {{content}}
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var demo = new Vue({
      el: '#demo',
      data: {
          title: 'todos',
          todos: [] //testing with data use: [{done:false,content:'testing'}]
      }
  });
  </code></pre>
  
  <p>Or: <a href="http://jsfiddle.net/ksumarine/yMv7y/301/" rel="nofollow">http://jsfiddle.net/ksumarine/yMv7y/301/</a></p>
  
  <p>I would like to display "No todos at this time" or something similar if the data comes back as empty. I can't figure out how to do this.</p>
  
  <p>Also, when I have something similar to this in my app, I see the mustache bindings on the page before Vue replaces it with the data. Any thoughts on how to hide the bindings from the user?</p>
  
  <p>Thanks for the help!</p>