骨干模板方法。我们为什么要传递模型?

时间:2016-12-14 16:46:51

标签: javascript backbone.js underscore.js underscore.js-templating

我无法弄清楚为什么我们将model.toJSON()传入此模板:

app.TodoView = Backbone.View.extend({
  tagName: 'li',
  template: _.template($('#item-template').html()),
  render: function(){
    this.$el.html(this.template(this.model.toJSON()));
    return this; // enable chained calls
  }
});

示例来自此tutorial

this.template(this.model.toJSON())对我来说是一个令人困惑的部分。模板方法似乎没有正确的参数?发生了什么事?

1 个答案:

答案 0 :(得分:3)

Underscore _.template function将模板字符串作为参数(以及可选的设置对象)并返回一个新的预编译模板函数,该函数将对象作为参数。

此对象是模板中使用的数据:

// creates a template function
var templateFunc = _.template("<span><%= name %></span>");

// render the template using the passed data
templateFunc({ name: "Émile" }); // <span>Émile</span>
  

默认情况下,template会将数据中的值放在本地   范围通过with声明。但是,您可以指定一个   变量名称为variable设置。

_.template("Using 'with': <%= data.answer %>", {variable: 'data'})({answer: 'no'});

model.toJSON()返回浅层副本或模型的attributes哈希值。

要达到上述例子的效果:

var model = new Backbone.Model({ name: "Émile" });
templateFunc(model.toJSON()); // <span>Émile</span>

对于Underscore.js before v1.7,模板函数签名略有不同:

_.template(templateString, [data], [settings]) 

如果传递了数据对象,则它没有返回函数,而是直接返回渲染的模板字符串。

_.template('This is <%= val %>.', { val: "deprecated" });
// This is deprecated.