Question

我是Marionette的初学者，并尝试创建使用此数据呈现发票/结算模板的视图：

    data={
        name: "jems"
        date: "may 15 2014"
        dataList:[
            {
                date: "may 15 2014",
                product: "xyz",
                qty: "3",
                rate: "5",
                totalAmount: "5"
            },
            {
                date: "may 15 2014",
                product: "xyz",
                qty: "3",
                rate: "5",
                totalAmount: "5"
            },
            {
                date: "may 15 2014",
                product: "xyz",
                qty: "3",
                rate: "5",
                totalAmount: "5"
            },
            {
                date: "may 15 2014",
                product: "xyz",
                qty: "3",
                rate: "5",
                totalAmount: "5"
            }
        ]
    }

我尝试使用http://jsfiddle.net/derickbailey/xX9X3/示例中的复合视图。但没有运气。

有点困惑，使用collectionView，compositeView，itemView创建嵌套发票类型视图。在一些嵌套视图示例中，我还发现使用的布局让我完全糊涂了。

请帮忙！

提前致谢！

Answer 1

您的数据不如小提琴示例中的数据复杂。您有1个包含集合的模型。根据我的经验，这需要为每个集合成员组合CompositeView + ItemView。

<script id="invoice-template" type="text/template">
<%= name %> on <%= date %>:

<ul></ul>
</script>

<script id="billing-template" type="text/template">
    <%= date %>, <%= totalAmount %>$ for product: <%= product %>
</script>    

var BillingView = Backbone.Marionette.ItemView.extend({
    template: "#billing-template",
    tagName: "li"
});

var InvoiceView = Backbone.Marionette.CompositeView.extend({
    template: "#invoice-template",

    tagName: "ul",
    itemView: BillingView    
});

请参阅此处的实际操作：http://jsfiddle.net/xX9X3/116/

如何在骨干牵线木偶中创建BIll或发票视图？

1 个答案: