使用Underscore.js加載外部模板

Question

//path = the location of the external file 
//scriptBlockId = the id of the external script block (<script id="add-form-tempate" type="text/html-template">) 
//fillId = where you want to place the template when rendered 
var App = Backbone.View.extend({ 
render: function (path, scriptBlockId, fillId) { 

    $.ajax({ 
     async: false, 
     dataType: 'html', 
     method: 'GET', 
     url: path, 
     success: function (response) { 
      //Not sure why we have to do this first, before we can select the script block? 
      var section = $('#main').append(response); 

      var templateString = $(section).find('#' + scriptBlockId).html(); 
      var compiledTemplate = _.template(templateString); 
      var temp = compiledTemplate(); 

      $(fillId).html(temp); 
     } 
    }); 

} 
}); 

var app = new App(); 
app.render(window.siteRoot + 'Scripts/_test1.tmpl.html', 'add-form-template', '#main'); 

此代碼有效！爲什麼我們必須先追加我不知道的......

Answer 1

您可能有問題w/aysnc $.ajax。

var App = Backbone.View.extend({ 
    render: function(path, scriptBlockId, fillId) { 
     var self = this; 

     $.ajax({ 
      async: false, 
      dataType: 'html', 
      method: 'GET', 
      url: path, 
      success: function(response) { 
       var templateString = $(response).find(scriptBlockId)[0].innerHTML, 
        compildeTemplate = _.template(templateString), 
        temp = compildeTemplate(); 

       $(fillId).html(temp); 
      } 
     }); 

     return this; 
    } 
}); 

var app = new App(); 
app.render(window.siteRoot + 'Scripts/_test1.tmpl.html', 'add-form-tempate', '#main'); 

我也試圖做什麼，我想你想通過搜索HTML結果的ID和拉內容指出，腳本塊來完成。