Question

我有一个视图，它持有把手模板。该模板由另一个部分模板组成。该部分模板包含结果列表，我在我的应用程序的不同部分使用。无论如何，当试图过滤结果时，我只想渲染那部分。意味着骨干视图不应该使整个视图只是局部的。能做到吗？

Answer 1

是的，这是可能的。最简单的方法是像渲染完整视图一样执行整个模板，但只替换视图el中所需的部分。

类似的东西：

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()才能正常工作。

根据评论进行修改：

为了澄清，我在这里建议的方法会再次执行视图的主要手柄模板，但不会再次渲染整个视图。

一步一步：

执行Handlebars模板功能，就像在普通渲染中一样。
```
var html = this.template(this.model.toJSON());
```
变量html现在包含HTML标记的字符串。什么都没有呈现。
为元素定义一个选择器，您想重新渲染它。
```
var selector = "#list";
```
找到要替换的DOM元素。这假设您已经渲染了一次视图。否则#list内将没有this.$el元素。
```
this.$el.find(selector)
```
在模板化的html字符串中找到相应的元素，并用新的元素替换现有的元素：
```
.replaceWith($(selector, html));
```

这只会替换当前页面上的#list元素。 #list以外的任何内容都不会以任何方式重新呈现或触及。

我建议你这样做的主要原因不是单独执行和渲染部分模板，而是你的视图不需要知道关于模板和模板引擎的实现细节的任何信息。所有它需要知道有一个元素#list。我相信这是一个更清洁的解决方案，并使您的模板详细信息与您的视图逻辑分开。

从骨干视图部分重新渲染把手

1 个答案: