Question

这可能是一个非常简单的问题，但我很难找到答案。

使用骨干，我有这一行：

Person = Backbone.Model.extend();

然后我在从URL填充的集合中使用它。为了这个例子，假设我有一个名字和姓，我想做一些像：

Person = Backbone.Model.extend({
    FullName: this.get("firstName") + " " + this.get("lastName")
});

我可以使用例如People.first（）。FullName（）来调用骨干内部。但是如果我将People.first（）传递给我的视图并在模板中呈现它，它似乎不知道FullName是什么。

如何在Backbone中为模型添加自定义属性并在模板中使用？

干杯！

Answer 1

你的FullName定义没有任何意义所以我会假设你真的是这个意思：

Person = Backbone.Model.extend({
    FullName: function() {
        return this.get("firstName") + " " + this.get("lastName");
    }
});

通常，您会在模型上调用toJSON来序列化它们以供模板使用：

var html = template({ person: person.toJSON() })

default toJSON只返回模型内部属性的（浅）副本。据推测，这些属性同时具有firstName和lastName属性，但FullName是模型上的一个函数，因此它不属于属性。

您可以提供自己的toJSON：

toJSON: function() {
    var j = _(this.attributes).clone();
    j.FullName = this.FullName();
    return j;
}

然后您的模板中会有FullName。但是，toJSON也用于序列化模型以将数据发送到服务器;您的服务器最终会看到FullName并且可能会对此感到不安。您可以专门为模板添加另一个序列化程序：

// `serialize` is another common name for this
for_template: function() {
    var j = this.toJSON();
    j.FullName = this.FullName();
    return j;
}

然后使用该函数为模板提供数据：

var html = template({ person: person.for_template() });

Answer 2

我也挣扎了一段时间，但我找到了解决方案。

它涵盖了相当深度，包括用于发送服务器数据的toJSON问题的解决方案，在Backbone Computed Properties

Answer 3

var Person = Backbone.Model.extend({
    parse: function (model) {
        model.FullName = model.FirstName + ' ' + model.LastName;
        return model;
    }
});

Answer 4

有一种更简单的方法。在initialize方法中包含您的方法。实例化模型时，所有方法都会被实例化。

var model = Backbone.Model.extend({
 initialize : function(){
      this.myCustomMethod = function(){ return 'Something'; };
 },
 idAttribute : 'id',
 urlRoot : ''
 });

Answer 5

完全不同的解决方法：

Backbone.Model.extend({
  defaults: function() {
    this.set('fullName', this.fullName.bind(this))
  },

  fullName: function() {
    return this.get('firstName') + this.get('lastName');
  }
});

这就是＆＃39; fullName＆＃39;函数可以直接在模型上调用

model.fullName()

或通过get函数，允许从模板中调用它：

model.get('fullName')()

Backbone.js - 如何在模板中使用自定义模型属性？

5 个答案: