title: Write VueJS data binding expression in href of <a> tag
body: <p>I'm using VueJS 2.0 with Laravel 5.3. I have Vue array data (e.g, <code>items</code>). Now I want to render those data in table using <code>v-for</code>. In table, there is a button to redirect page to item details page. For that, I'm writing my static URL till <code>/</code> in href of  tag. Then I'm appending {{item.id}}. But I'm getting this error.</p>
  
  <blockquote>
    <p>Interpolation inside attributes has been removed. Use v-bind or the
    colon shorthand instead. For example, instead of ,
    use <code>&lt;div :id="val"&gt;</code></p>
  </blockquote>
  
  <p>So I can't get that how to write data binding expression of VueJS in <code>&lt;a href=""&gt;</code>. If anyone knows the solution, it will be appreciated.</p>
  
  <p>Here is my code.</p>
  
  <p><strong>my-items.blade.php</strong></p>
  
  <pre><code>&lt;div id="app"&gt;
  ....
      &lt;tr v-for="item in items"&gt;
          &lt;td&gt;
              &lt;a href="{{url('/item')}}/@{{item.id}}"&gt;view&lt;/a&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  ....
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>my-items.js</strong></p>
  
  <pre><code>new Vue({
      el: '#app',
      data: {
          items: [
              {id: 1},
              {id: 2},
              {id: 3}
          ]
      },
  })
  </code></pre>
  
  <p><strong>EDIT</strong></p>
  
  <p>Here is what I was doing in AngularJS with Laravel 5.2. And I want similar like this.</p>
  
  <pre><code>&lt;a href="{{url('/item')}}/@{{item.id}}"&gt;view&lt;/a&gt;
  </code></pre>