【发布时间】：2013-04-03 04:53:44
【问题描述】：
所以我有两个模板，一个是父模板，另一个是包含子视图的模板。我的第一个父视图扩展了主干的视图，它的渲染方法看起来像
render: function () {
this.$el.append(templates["template-parent-test"](this.model));
return this;
}
这个父视图上有一个按钮。我现在用来填充视图的按钮。它基本上是这样做的：
populateView: function () {
// create some dummy test data to match the web service
_.each(myModel, function (theModel) {
var testView = new childView({ model: theModel });
this.$('div-in-parent-view').append(testView.render().$el);
});
}
这个主干视图扩展了 Backbone.View，它的渲染方法看起来像：
render: function () {
console.log("rendering child view");
this.$el.html(this.template({ data: this.model.toJSON() }));
return this;
}
所以这行得通。但我不想在按下按钮时填充父视图。我想在第一次显示它时填充它，并让按钮执行其实际应该执行的操作。我认为我可以从父视图中的渲染函数调用 this.populateView() ，但实际上没有渲染任何内容。但是，如果我在按钮事件中执行 this.populateView()，它就会被渲染。为什么这里有区别？谢谢。
【问题讨论】：
-
在
this.$el.append之后调用父视图的render中的this.populateView会发生什么？那时 myModel 是空的吗？我猜测在父级的渲染中 myModel 是空的，但是当单击按钮时已经过了足够的时间并且集合已被填充。 -
@PaulHoenecke 不，此时 myModel 不为空。我实际上还没有与网络服务交谈。我只是想模拟视图以便与 Web 服务对话。所以我实际上只是创建了一些虚拟测试数据。我实际上在我的代码中记录了我没有包含的数据，并且模型数据都在那里。
-
而
myModel是在某处定义的？在您显示的代码中，它看起来像全局变量或局部变量，而不是视图的属性。我想这不是问题，因为您说它可以通过单击按钮来工作。我认为您应该显示更多代码，并且处于产生问题的状态。 -
@PaulHoenecke 是的，//create some dummy test data 是写的，所以我实际上不必在其中 c&p 我的模型。所以我想这就是我试图确定的，如果从逻辑上讲，我应该能够调用这个方法来渲染父视图中的子视图，如果我知道我在用主干做什么应该可以： P。由于它适用于按钮单击，我认为我可以将它放在我父母的渲染功能中。那是我最困惑的部分。
-
是的，您应该能够在父级的渲染方法中做到这一点。似乎问题出在其他代码中。您看到来自
console.log("rendering child view");的日志记录了吗？