after creating a web app using backbone for an engine design firm, I'm wondering if I should move the "if/then" logic out of the html templates.
To help clarify what I mean, here are two examples that I am currently using in production.
If I move the if/then logic out of the template, I would move it to the view, but I'm not sure if that's the "right" way or "backbone" way of doing things.
Am I making poor design decisions, or is what I've done OK?
Thanks!
Simple Example 1:
In the view:
//m is the model used by the view
return Backbone.View.extend({
template: _.template(tmpl, null, { variable: 'm' }),
In the template:
{% if(m.title) { %}
<h4> {%- m.title %} </h4>
{% } else { %}
<h4>Experiment Title Goes Here</h4>
{% } %}
Complex Example 2:
In the view:
//args are the model attributes passed into the view
initialize: function (args) {
this.currentEngine = args.currentEngine;
this.engineDisplay = args.engineDisplay;
this.engineType = args.engineType;
this.isCurrent = this.model.isCurrent(this.currentEngine);
},
render: function () {
this.$el.html(this.template({
engineDisplay: this.engineDisplay,
engineType: this.engineType,
isCurrent: this.isCurrent;
}));
In the template:
{% if(!engineDisplay) { %}
{% if (m.isCurrent && (engineType === 'GAS' || engineType === 'ECO')) { %}
<span>Not Available</span>
{% } else { %}
<span>
<span>Click here to select</span>
</span>
{% } %}
{% } %}
I think your first implementation was correct. Keep the logic out of the view. The "correct" way, or the "backbone" way is to keep the logic where it needs to be:
I'm sure im missing stuff.. i'll wait until the comments tells me how wrong i am and then i'll correct it.
-Sheers