渲染对象下划线模板

TL;博士
我呈现的项目集合到骨干视图，通过他们来说明是什么将是一个数组的父视图，并尝试从一个下划线模板中显示出来。而不是html，我得到[object HtmlDivElement]。渲染对象下划线模板

全面介绍

我有一种观点产生的这样的：

我从我的后端接收数据，
我通过线
我收到回报的视图

这个过程的重点是一般接收来自不同源的响应，其中来自每个源的数据需要以不同的方式进行解析。我知道并根据请求定义了每个集合的解析方法。

相关的代码：

var ResultGroupView = Backbone.View.extend({ 
    tagName: 'tbody', 
    initialize: function (options) { 
     var self = this; 
     self.collection = new ResultGroupModel(); 
     self.parent = options.parent; 
     self.collection.bind('add', self.renderItem, self); 
     _.bindAll(self, 'render', 'renderItem', 'addItem'); 
     [...] 
    } 
    template: _.template(resultGroupTemplate), 
    addItem: function (item) { 
     var self = this; 
     var values = []; 
     //a new item is being added to the collection. get the details on how to parse it 
     _(self.parent.getColumns()).each(function (v) { 
      values.push(((!!v.parser) ? v.parser.call(self, item[v.Id]) : item[v.Id])); 
     }); 

     //due to the binding above, this next line triggers the renderItem function 
     self.collection.add(new ResultItemModel({ Id: item.Id, Values: values })); 
    }, 
    renderItem: function (item) { 
     var self = this; 
     //ResultItemView has tagName: 'tr' 
     var itemView = new ResultItemView({ 
      model: item, 
      parent: self 
     }); 
     self.$el.append(itemView.render().el); 
    }, 
    [...] 
});

每种类型的数据已定义了不同parser功能。具体来说，我们有v.parser.call(self, item[v.Id])，这是对视图生成器的调用。解析器只需创建一个主干View并返回呈现的对象。

上面提到的ResultItemView只是呈现其视图在一个强调模板，那就是：

<td><input type="checkbox" value="<%=Id%>" /></td> 
<% _.each(Values, function(Val) { %> 
    <td> 
     <%=Val%> 
    </td> 
<% }); %>

什么结束了在那里说：<%=Val%>是[object HtmlImgElement]，[object HtmlDivElement]等上显示。

显然，有我在，我是如何通过的意见之间插入模板信息的了解一些基本的错误...但我无法弄清楚需要改变什么。

我觉得沿着node.outerHTML || new XMLSerializer().serializeToString(node);（如here所述）使用的东西是相当黑客...有没有更好的解决方法呢？

来源

2016-01-03 Guy Passy

*“解析器只是创建一个主体视图并返回呈现的对象。”* - 好吧..所以我明白'parser'创建一个主干视图。但是，你的意思是“渲染对象”。* ..？!!如果解析器创建骨干视图，你为什么又创建与解析的值，该模型的模型和另一种观点认为，'ResultItemView' ..？解析器创建的骨干视图的目的是什么？？!! “价值”看起来像什么？ –

@TJ我不清楚......“*渲染对象*”是一个子视图的元素。我说*呈现对象*是因为虽然它是一堆html元素，但它还不在DOM中，并且在尝试添加它时，我得到了'[object DivHtmlElement]'或其他一些东西。我实际上有3层 - “ResultGroupView”是最上层，“ResultItemView”是中间层，“* parsed view *”是最底层。 'ResultGroupView'包含一个'ResultItemModel'的集合，该集合又包含一个“* parsed view *”的数组。然后每个新的'ResultItemModel'自动呈现（'bind（'add'，[]]'） –

没问题，所以你有一个集合'ResultGroup'和一个'ResultGroupView'，它为每个呈现'ResultItemView' 'ResultGroup'中的'ResultItem'。我得到了那么多，但后来我迷路了 - “* ResultItemModel，它又包含”解析视图“的数组* *”为什么你在模型中存储大量视图？如果'values'实际上是一个骨干视图数组，为什么要用下划线打印视图对象的属性..？!!这些视图应该有一个呈现方法，呈现它的数据，你应该将它们附加到DOM。 –

我怀疑你是在想这个。它是那样简单，在你renderItem方法，改变...

self.$el.append(itemView.render().el);

...到...

self.$el.append(itemView.render().$el.html());

...？

来源

2016-01-03 19:00:47

渲染对象下划线模板

回答

相关问题