Errore di lancio del modello di sottolineatura non definito errore

Question

Ho visto alcuni video sull'argomento di backbone js. Questo è un esempio direttamente dal video. È dal 2012, quindi penso che le regole di backbone/libreria siano cambiate, ma non riesco a capire perché questo non funzioni al momento. Nel video, la persona lo mostra in esecuzione nel JS Fiddle, ma non riesco a farlo funzionare. (Ho incluso le librerie necessarie a JS Fiddle, vale a dire di sottolineatura, spina dorsale e jQuery)

var V = Backbone.View.extend({ 
 
    el:'body', 
 
    render: function() { 
 
    \t var data = { lat: -27, lon: 153 }; 
 
    this.$el.html(_.template('<%= lat %> <%= lon%>', data)); 
 
    return this; 
 
    } 
 
}); 
 

 
var v = new V(); 
 

 
v.render();

<script src="http://underscorejs.org/underscore-min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="http://backbonejs.org/backbone-min.js"></script>

Answer 1

È usato per essere in grado di analizzare e compilare un modello di sottolineatura in un colpo solo come questo :

var html = _.template(template_string, data); 

Ma, come di sottolineatura 1.7.0, il secondo argomento di _.template contiene opzioni di modello

modello_.template(templateString, [settings])

modelli Compila JavaScript in funzioni che possono essere valutati per il rendering. [...] L'argomento delle impostazioni deve essere un hash contenente qualsiasi _.templateSettings che deve essere sovrascritto.

È necessario compilare il modello utilizzando _.template e poi eseguire la funzione tornato per ottenere il vostro compilato modello:

var tmpl = _.template(template_string); 
var html = tmpl(data); 

// or as a one-liner, note where all the parentheses are 
var html = _.template(template_string)(data); 

Nel tuo caso, sarebbe simile a questa:

var V = Backbone.View.extend({ 
 
    el:'body', 
 
    render: function() { 
 
    var data = { lat: -27, lon: 153 }; 
 
    var tmpl = _.template('<%= lat %> <%= lon %>'); 
 
    this.$el.html(tmpl(data)); 
 
    return this; 
 
    } 
 
}); 
 

 
var v = new V(); 
 

 
v.render();

<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> 
 

 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.0/backbone-min.js"></script>

Answer 2

Questo può essere u Informazioni utili

1: Se si dispone di più di un modello o qualche volta si utilizza modello esterno in modo che possa essere utile per voi metodo all'interno è possibile scrivere codice riutilizzabile

var V = Backbone.View.extend({ 

    el:'body', 

     temp: function (str) { 

      // reusable code 
      return _.template(str); 
     }, 
     render: function() { 
      var data = { lat: -27, lon: 153 }; 

      // calling your view method temp   
      var tmpl = this.temp('<%= lat %> <%= lon %>'); 

      this.$el.html(tmpl(data)); 

      return this; 
     } 
    }); 

    var v = new V(); 

    v.render();