3

我正在使用backbone.js，我试图了解我是否做错了什么，或者这是主干应该如何表现。

我正在构建一个表格，因为我有 2 个模板，第一个模板是<thead>与问题无关的所有容器和信息。

然后我将项目集合呈现为行。有了这个观点：

   MYAPP.Menu.ItemView = Backbone.View.extend({
    tagName: 'tr',      
    template: template('menu-item'),
    initialize : function(modelItem) {
    this.model = modelItem;
    this.model.on('all', this.render, this);
    },
    render : function() {
        var html = this.template(this.model.toJSON());
        this.$el.html(html);
        return this;
    }
});

这是菜单项的模板：

  <script type="text/x-mustache-template" id="menu-item-template">
            <td>{{title}}</td>
            <td>{{description}}</td>
            <td>{{price}}</td>
            <td>{{status}}</td>
            <td></td>
    </script>

我在<tbody>标签内得到的输出是这样的：

     <tr id="1" title="title1" price="price1">
            <td>title1</td>
            <td></td>
            <td>price1</td>
            <td></td>
            <td></td>
    </tr>

等等。 那么问题来了

为什么所有数据都存储在<tr>标签内作为属性？我不想要那个。为什么会在那里？

谢谢。

4

1 回答 1

10

您很可能像这样初始化您的视图：

new MYAPP.Menu.ItemView(someModel);

options这是不正确的，正确的方法是使用 key在对象中传递模型model：

new MYAPP.Menu.ItemView({model:someModel});

模型属性被设置为元素属性的事实只是命名中的一个不幸的巧合。在内部Backbone.Model将其值存储在名为 的属性中attributes。Backbone.View另一方面，接受attributes在 options 参数中调用的选项，并将其复制到View.attributes，然后将它们设置为根元素的属性。

有一些特殊属性会自动复制到视图中：id、cssClass、 和el，仅举几例。因为模型只是一个对象，所以调用相当于，这会导致您看到的奇怪效果。modelcollectionnew View(model)new View({id:id, attributes:attributes, ...})

因此，查看您的构造函数代码，它应该如下所示：

initialize : function(options) {
   this.model = options.model;
   this.model.on('all', this.render, this);
}

但是因为 Backbone 负责为您设置一些 View 的选项，包括model，所以严格来说，您甚至不需要设置this.model：

initialize : function(options) {
   this.model.on('all', this.render, this);
}
于 2013-01-16T20:18:35.673 回答