Backbone.js 从Mustach模板访问嵌套主干模型属性

我有一个主干模型，它的一个属性是对另一个主干模型的引用。例如，一个人有一个对地址对象的引用

Person
  FirstName
  LastName
  Address
    Street
    City
    State
    Zip

这些类扩展了主干模型。那么，如果我构造一个如下的对象

var address = new Address({ Street: "123 Main", City: "Austin" });
var person = new Person({ FirstName: "John", Address: address });

我似乎不知道如何在我的胡子模板中访问它

Hi {{FirstName}}, you live in {{Address.City}}.

显然不起作用。当我查看Firebug的内部时，Address是一个对象，而City是Address的attributes对象中的一个属性。我找不到如何访问关联对象的这些属性的任何示例

谢谢你的帮助！谢谢

尝试使用，一个基于mustach的模板引擎，支持嵌套属性

然后它将像

{{Address/City}

一样简单

---

如果不想更改模板引擎，可以将

地址

对象的结果展平，并将其作为属性直接传递到

人员

上。最后，我用以下方法解决了这个问题

对于模板引擎，我从Mustache.js切换到handlebar.js。这允许我使用基于路径的表达式访问嵌套或关联的对象及其属性

Hi {{FirstName}}. You live in {{Address.City}}.

但是，我还必须改变向模板传递JSON对象的方式。我使用的toJSON方法是Backbone.Model类的一部分。但是，这并没有正确地为关联的地址生成JSON（以便模板工作）。它将地址属性隐藏在名为“attributes”的成员中。所以，相反，我最终做了这个

var jsonForTemplate = JSON.parse(JSON.stringify(person));

---

这为我提供了对象及其关联对象的“原始”版本，模板可以使用上面显示的语法访问这些对象。JSON.parse和JSON.stringify都是json2.js的一部分。

我通过制作另一个名为deepToJSON的toJSON版本来处理这个问题，该版本递归地遍历嵌套模型和集合。然后可以将该函数的返回值传递给handlebar.js模板

Hi {{FirstName}}, you live in {{Address.City}}.

代码如下：

_.extend(Backbone.Model.prototype, {
  // Version of toJSON that traverses nested models
  deepToJSON: function() {
    var obj = this.toJSON();
    _.each(_.keys(obj), function(key) {
      if (_.isFunction(obj[key].deepToJSON)) {
        obj[key] = obj[key].deepToJSON();
      }
    });
    return obj;
  }
});

_.extend(Backbone.Collection.prototype, {
  // Version of toJSON that traverses nested models
  deepToJSON: function() {
    return this.map(function(model){ return model.deepToJSON(); });
  }
});

---

在胡子方面，大致相同的方法如下：

嗨

---

希望有帮助。

谢谢，我一定要试试把手。我仍然对主干网的toJSON如何处理相关模型感到好奇。看起来（从Firebug中查看）它将关联模型的属性嵌套在“attributes”成员下。我需要测试把手是否可以找到地址/城市，或者是否需要执行类似地址/属性/城市的操作。不确定。可能是另一个问题。@Kevin嘿，Kevin，你有没有想过：如何正确处理地址/属性/城市？谢谢。我想知道这是否比我上面的方法更好。我认为最终的结果是相似的。我认为性能大致相同。代码可读性和最小化错误是这里的好处，imo。谢谢。在递归调用deepToJSON之前，我不得不稍微修改一下你的命令，检查对象值是否为null：

如果（！（uj.isNull（obj[key]）| 124;.isUndefined（obj[key]）&&&&&.isFunction（obj[key].deepToJSON））{

@EricHu ha我也做了同样的事情（你的评论在我的浏览器下面）并且即将重新发布相同的注释。至少在使用pystache时，这对我不起作用。无法判断这是错误还是预期行为。如果将主干模型（“this.model.toJSON（）”）传递到模板，则添加{{{属性}}可能会有所帮助。例如{{属性}{{地址}{{City}{{Address}{{attributes}}{哦，太好了，这是我一直在寻找的解决方案