2015-03-13 2 views
0

Я создаю базовый вид, содержимое которого динамически загружается с помощью строки параметров маршрутизатора. Поэтому я создаю представление с основным шаблоном и несколькими дополнительными шаблонами.Загрузка базового шаблона с использованием строки маршрутизатора

Вот мое мнение:

define(["jquery" , 
"underscore" , 
"backbone" , 
"text!templates/Content/confirmMessageTemplate.html", 
"text!templates/Content/registerMessage.html", 
"text!templates/Content/signInMessage.html" 
],function($ , _ ,Backbone,ConfirmMessageTem,RegisterMessage,SignInMessage){ 
var teView = Backbone.View.extend({ 
    initialize: function(options) { 
     this.options = options || {}; 
    }, 
    render: function(){ 
     var message = _.template(ConfirmMessageTem); 
     var subtem = _.template(RegisterMessage); 
     this.$el.html(message({msgheader:this.options.msgheader, body:subtem()})); 
    } 
}); 
return teView; 
}); 

body:subtem() бросает югу шаблон для основного шаблона.

this.options.title[0] получает значение строки (RegisterMessage, SignInMessage, .....) Так что я хочу, чтобы загрузить мой шаблон суб динамически, как:

var subtem = _.template(this.options.title[0]); 

Но я не мог заархивировать его из-за this.options.title[0] возврата строка.

Любые предложения будут оценены.

+0

некоторые вещи, как это? 'render: function() {tmpPath = this.options.title [0] .charAt (0) .toUpperCase() + this.options.title [0] .slice (1); require (tmpPath, function (path) {var tmp = _.template (path)): $ el.html (...)})} ' – Evgeniy

ответ

0

Если у вас есть только несколько динамически выбираемых шаблонов, что-то подобное может быть сделано:

define(["jquery" , 
    "underscore" , 
    "backbone" , 
    "text!templates/Content/confirmMessageTemplate.html", 
    "text!templates/Content/registerMessage.html", 
    "text!templates/Content/signInMessage.html" 
],function($, _, Backbone, ConfirmMessageTem, RegisterMessage, SignInMessage){ 

    var teView = Backbone.View.extend({ 

     // make a hash of templates and attach that hash to teView, where key of 
     // the hash would be the router string that is returned in 
     // this.options.title[0] in your render method 
     templatesHash: { 

      "RegisterMessage": RegisterMessage, 
      "SignInMessage": SignInMessage 

     }, 

     initialize: function(options) { 
      this.options = options || {}; 
     }, 

     render: function(){ 
      var message = _.template(ConfirmMessageTem); 

      // and here subtem can be initialized as below - 
      // by reading the template from the templatesHash 
      // var subtem = _.template(RegisterMessage); 
      var subtem = _.template(this.templatesHash[ this.options.title[0] ]); 

      this.$el.html(message({msgheader:this.options.msgheader, body:subtem()})); 
     } 

    }); 

    return teView; 
}); 
+0

' this.templatesHash [this.options.title [0] 'is undefined, когда я сделал 'console.log' в браузере. – Nothing

+0

Не могли бы вы проверить, что он печатает для 'this.templatesHash' в консоли? И также, 'this.options.title [0]'. – Cyclone

+0

'Object {dealerRegistration: // content in my html file ....}' – Nothing

Смежные вопросы