title: Setting the router-link to attribute with component data in Vue.js
body: <p>How to inject component data in <code>&lt;router-link to="..."&gt;</code>? Sample:</p>
  
  <pre><code>var data = {files: [{name: "test", path: "/test"}]};
  
  var component = {
      data: function() {
          return data
      },
      template: '&lt;ul class="files"&gt;&lt;li v-for="file in files"&gt;&lt;router-link to="{{ file.path }}"&gt;{{ file.name }}&lt;/router-link&gt;&lt;/li&gt;&lt;/ul&gt;',
      created: function() {...}
  };
  </code></pre>
  
  <p>In this sample the output is <code>&lt;li&gt;&lt;a href="#/{{ file.path }} "&gt;test&lt;/a&gt;&lt;/li&gt;</code>. How do I get <code>/test</code> instead of <code>#/{{ file.path }}</code>?</p>