Backbone.js 从主干视图重新渲染部分把手

我有一个视图，其中包含把手模板。 该模板由另一部分模板组成。 该部分模板包含一个结果列表，我在应用程序的不同部分使用该列表。 无论如何，在尝试过滤结果时，我只希望渲染该部分。这意味着主干视图不应渲染整个视图，而应渲染部分视图。

---

能做到吗

是的，这是可能的。最简单的方法是在渲染整个视图时执行整个模板，但只替换视图的

el

中所需的部分

this.$el.find(selector)

比如：

template: Handlebars.compile(templateHtml),

render: function() {
  //let's say your render looks something like this
  this.$el.html(this.template(this.model.toJSON());
},

renderList: function() {
  var html = this.template(this.model.toJSON());
  var selector = "#list";

  //replace only the contents of the #list element
  this.$el.find(selector).replaceWith($(selector, html));
}

根据模板的动态程度，在替换列表后，您可能必须调用

this.delegateEvents（）

，视图的事件才能正常工作

根据评论进行编辑：

为了澄清，我在这里提出的方法会再次执行视图的主把手模板，但它不会再次渲染整个视图

逐步：

像在普通渲染中一样执行把手模板函数

var html = this.template(this.model.toJSON());

变量

html

现在包含html标记的字符串。还没有任何结果

为要重新渲染的元素定义选择器

var selector = "#list";

查找要替换的DOM元素。这假定您已经渲染视图一次。否则，$el中将没有

#list

元素

this.$el.find(selector)

在模板化html字符串中找到相应的元素，并用新元素替换现有元素：

.replaceWith($(selector, html));

这将仅替换页面上当前的

#list

元素。

#列表

之外的任何内容都不会以任何方式重新渲染或触摸

---

我建议您这样做而不是单独执行和呈现部分模板的主要原因是，您的视图不需要了解任何有关模板和模板引擎的实现细节。它只需要知道有一个元素

#list

。我相信这是一个更干净的解决方案，可以将模板细节与视图逻辑分开

仍然无法让它工作…视图中的模板不是常量，初始化方法定义了它。所以我以前尝试过再次设置它……我的方法如下所示：this.template=handlebar.compile（$（'#tmpl news partial'）.html（））；var html=this.template（{news:this.collection.toJSON（）}）；var选择器=“#新闻列表”；这个.el.find（选择器）.replaceWith（$（选择器，html））；this.template=handlebar.compile（$（'#tmpl list news'）.html（））@tomerz，最后重新编译模板是怎么回事？另外，列表id是否实际上是带有两个

的
#newssList
？还要注意的是，这只在完全渲染模板一次后才起作用。哈哈，好吧……因为我的视图在最后使用了模板，所以我会在之前设置它，使用它，然后将它设置回原来的值。列表id不是news…；）@托默兹，不客气。顺便说一句，你最终解决这个问题的方式和我的意思不太一样，但如果它有效，那也很酷。另外，您不需要将临时模板设置为
this.template
，然后将其更改回来，您可以调用
this.partialTemplate
或其他任何名称，或者只使用局部变量。我以为Handlebar的模板方法使用的是this.template，不是吗？我可以传递另一个模板给它吗？