title: Getting JSON in to Underscore Template in Backbone
body: <p>Just getting started with Backbone and still making sense of the ins and outs.</p>
  
  <p>I'm trying to simply display some JSON using Underscore and Backbone. I'm able to make it to work just using Underscore and $.getJSON, but when I try to wire it up with Backbone I get a variety of errors depending upon what I try.</p>
  
  <p>I've also been able to get Backbone to work by hardcoding values in to the model, but I'm running in to a wall when I try to bring it all together. Any help is appreciated.</p>
  
  <p>Here is my Underscore template:</p>
  
  <pre><code>&lt;script type="text/html" id='trailTemplate'&gt;
  
      &lt;% _.each(trails,function(trail){ %&gt;
  
          &lt;%= trail.trailname %&gt;&lt;br /&gt;
  
      &lt;% }); %&gt;
  
  &lt;/script&gt;
  </code></pre>
  
  <p>And here is my Backbone code:</p>
  
  <pre><code>var Trail = Backbone.Model.extend({
      urlRoot: "trails.json"
  });
  
  var trail = new Trail({});
  
  var TrailView = Backbone.View.extend({
      el: '.page',
  
      template: _.template($("#trailTemplate").html(), {trails:trail.fetch()}),
  
      render: function(){
          this.$el.html(this.template(this.model.toJSON()));
          return this;
      }
  });
  
  var trailView = new TrailView({
      model: trail
  });
  
  trailView.render();
  </code></pre>
  
  <p>And in case you need it, here is trails.json</p>
  
  <pre><code>[
          {
              "trailhead": "Bear Lake",
              "trailname": "Bear Lake",
              "distance": ".5",
              "gain": "20",
              "level": "easy"
          },
  
          {
              "trailhead": "Bear Lake",
              "trailname": "Nymph Lake",
              "distance": ".5",
              "gain": "225",
              "level": "fairly easy"
          }
  ]
  </code></pre>