언더 코어 .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

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'); 

또한 ID에 대한 HTML 결과를 검색하고 해당 스크립트 블록에서 콘텐츠를 가져 와서 수행하려고 시도한 것으로 보았습니다.