CODEWITHSUNDEEP
javascriptbackbone.jsunderscore.js
Kirill Kaysarov
Kirill Kaysarov

Reputation: 13

Dynamic Backbone Template Variable

// Template Helper
window.template = function (id) {
return _.template($('#' + id).html());
};

// Template Helper in view.render
this.$el.html( this.template(this.model.toJSON()) );

// This Template Call in View
template: template('response-form')

// This My If Else Construction in View Initialize
if (this.model.attributes.status === true) {
  here i want set template id to response-auth
} else {
  here i want set template id to response-form
}

I dont have idea, how i can dynamicly change value of template call? Did someone can help me?

Upvotes: 0

Views: 942

Answers (2)

Saurabh
Saurabh

Reputation: 462

@mu is too short: Isn't any way by which we can pass dynamic data inside

template('response-auth');

Suppose I got more than 50 template, then I can't put if else statement.

$(`#channel-view-${targetPlatformId}`).html(_.template(templates.manage_store_form_template_Ebay)({


$(`#channel-view-${targetPlatformId}`).html(_.template(templates.manage_store_form_template_shopify)({

There is one difference in above line, that is channel name, Is there any way I can pass dynamic data inside _.template()

Upvotes: 0

mu is too short
mu is too short

Reputation: 434945

You can change this.template whenever you want inside your view. So, you could check the status in your view's initialize:

initialize: function() {
    if(this.model.get('status'))
        this.template = template('response-auth');
    else
        this.template = template('response-form');
}

Or you could make the decision inside render:

render: function() {
    var tmpl = null;
    if(this.model.get('status'))
        tmpl = template('response-auth');
    else
        tmpl = template('response-form');

    // your current rendering code goes here but uses
    // tmpl instead of this.template
}

Which approach you take depends on whether or not you're expecting the status to change.

You could, of course, compile both when building the view:

template_auth: template('response-auth'),
template_form: template('response-form'),
initialize: function() {
    // Set this.template to this.template_auth or this.template_form...
},
render: function() {
    // Or pick this.template_auth or this.template_form in here if
    // that makes sense...
}

If you're expecting to use both templates then compiling them both would make sense, otherwise I'd leave the decision until it needs to be made (probably in render).

Upvotes: 2

Related Questions