Question

我现在正试图让我的头围绕骨干。

所以我有了模型，加载了JSON文件和集合，但是我无法指出在视图中将数组显示到下划线模板的最佳方式。

我很累，似乎经历了很多教程，都有不同的方式通过视图输出这些数据到模板。这样做有正确的方法吗？我猜它应该用_.each循环？我甚至在正确的道路上？ ;）

请参阅以下代码。

非常感谢

<head>




</head>
<body>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone.js"></script>


    <script type="text/javascript">

        var News = Backbone.Model.extend();

        var Newscollection = Backbone.Collection.extend({
            model: News,
            url: 'data.js'
        });

        var NewView = Backbone.View.extend({
            el: '#News',
            template: _.template($("#NewsTemplate").html()),

            render: function() {
                $(this.el).html(this.template(this.model.toJSON()));
                return this;
            }
        });


    </script>


    <div id="News"></div>


    <script id="NewsTemplate" type="text/template">
        <%= title %>
    </script>

</body>

Answer 1

如果您想将集合传递给模板，可以执行以下操作：

1：在视图中定义新集合。在您的收藏中添加一些模型。我们将其定义为this.collection，我们假设在渲染时集合中有多个模型。

2：将一个对象传递给模板。使用'collection'作为键和JSON化的集合（模型数组）作为值来创建一个对象：

$(this.el).html(this.template({'collection': this.collection.toJSON()}));

3：现在，在模板中，我们可以使用<%= collection %>来引用该集合。但是，我认为您想循环遍历集合以呈现值。在HTML模板中，您可以使用下划线的_.each：

创建循环

    <ul>
    <% _.each(collection, function(item) { %>
        <li> <%= item.id %> : <%= item.title %> </li>
    <% }); %>
    </ul>

如果您的模型具有id和name属性，则会在集合中打印您的模型列表。

另一种更多'backbone-ish'方法是为集合中的每个模型创建一个新视图，类似于本教程中的待办事项：http://arturadib.com/hello-backbonejs/。

骨干Json视图模板

1 个答案: