如何构建模板复合视图动态 [英] How to construct template for Composite view Dynamically

问题描述

所需的输出：

  <script id="table-template" type="text/html">
      <table>
        <thead>
           ADD THE HEADER NAMES HERE DYNAMICALLY,
        </thead>        
        <!-- insert collection items -->
        <tbody></tbody>
      </table>
    </script>

我试图让产生上面的模板，这里的问题是头名

I am trying to get the above template generated, the problem here is the header names

        投资组合
        量
        交换
        金额Fccy
        数量
        帐户
    

Portfolio Amount Exchange Amount in Fccy Quantity Account

像上面将是固定的，用户可以提供任何数目的标题名称的

like the above it would be the fixed one, the user can give any number of header names.

这是code我做：

Grid.Hexgrid = Backbone.Marionette.CompositeView.extend({
         template: "#header", 
         initialize : function (options){
           this.header = options.header;
        },
        onRender : function(){
            ADD THE HEADER INFORMATION HERE WHICH WILL COME UNDER <THEAD></THEAD>
        },

      appendHtml: function(collectionView, itemView, index){
        collectionView.$("tbody").append(itemView.el);
      }
    });

我在粗体一封信给我的意见。会有人帮助我完成这个请。

I have given my comments in BOLD letter. would somebody help me to complete this Please.

推荐答案

您不需要在您的视图设置模板属性，作为函数getTemplate会为你做的。

You don't need to set the template properties in your view, as the function getTemplate would do that for you.

反正来生成你的头dinamically我建议你另一条路线，只是你的头的数据传递到您的模板那样：

Anyway to generate your header dinamically I suggest you another route, to just pass your header's data to your template like that:

serializeData: function() {
    var data = Backbone.Marionette.ItemView.prototype.serializeData.apply(this, arguments);
    data.header = this.header;
    return data;
}

然后在您的模板，你可以这样做：

And then in your template you could do:

<% _.each(header,function(h){ %>
    <div class="span2"><%= h %></div>
<% }); %>

这篇关于如何构建模板复合视图动态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！