title: How do I pass a dynamic page :id to $http.get url in Vue.js
body: <p>I have have view router set up:</p>
  
  <pre><code>router.map({
      '/tracks/:id': {
          component: SingleTrack
      }
  })
  </code></pre>
  
  <p>And this is my component (which works with a hard coded URL):</p>
  
  <pre><code>var SingleTrack = Vue.component('track', {
  
      template: '#track-template',
  
      data: function() {
          return {
              track: ''
          }
      },
  
      ready: function() {
          this.$http.get('//api.trax.dev/tracks/1', function (data) {
              this.$set('track', data.track)
          })
      }
  });
  </code></pre>
  
  <p>How do I pass the url/:id to the end of the <code>$http.get</code> string so i can grab the correct data dynamically when that route in loaded, something like:</p>
  
  <pre><code>ready: function(id) {
      this.$http.get('//api.trax.dev/tracks/' + id, function (data) {
          this.$set('track', data.track)
      })
  }
  </code></pre>