1

我的主干观点面临问题。我正在尝试渲染一组日对象，并且每个日对象都包含另一个时间对象数组。我从我的 API 中获取集合就好了，但是一旦呈现它就会显示：

在此处输入图像描述

从控制台可以看出，这基本上是我收藏的最后一件。API 调用实际上返回有效的输出。

这是我的模板的样子：

<table id="stbl" class="table table-striped table-bordered">
     <% _.each(slots, function(slot) { %>
              <tr>
                <td>
                   <strong> <%- slot.startDate %> </strong>
                </td>
                <% _.each(slot.timeSlots, function(t) { %>
                    <td>
                       <button id="le-time" class="btn btn-primary"><%- t %></button>
                    </td>
                <% }); %>
               </tr>
         <% }); %>
</table>

这是我的收藏：

kronos.Slots = Backbone.Collection.extend({
    model: kronos.Slot,
    url: '/api/freeslots'
});

这就是我的观点：

kronos.TableView = Backbone.View.extend({
    initialize: function () {
        var self = this;
        this.collection.fetch({
            success: function (collection, response) {
                _.each(response, function (i) {
                    console.log(i);
                });
                self.render();
            },
            data: $.param({ orgID: 4 })
        });
        this.collection.on('reset', this.render, this);
    },
    template: _.template($('#slotsTable').html()),
    render: function () {
        $('#slotsContainer').html(this.template({
            slots: this.collection.toJSON()
        }));
    }
});

fetch 调用返回的 JSON 数据

[
    {"id":0, "startDate":"04/11/2013", "serviceID":241, "providerID":223, "timeSlots": ["09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00"]},
    {"id":0, "startDate":"05/11/2013", "serviceID":241, "providerID":223, "timeSlots": ["09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00"]}
]

你能帮我理解我在这里做错了什么吗？

谢谢

4

1 回答 1

3

当在集合中获取数据时，Backbone 将使用数据执行一个collection.set：

set collection.set(models, [options])
set 方法使用传递的模型列表对集合执行“智能”更新。如果列表中的模型尚未在集合中，它将被添加；如果模型已经在集合中，它的属性将被合并；如果集合包含列表中不存在的任何模型，它们将被删除。

你所有的模型都有相同的 id，0，这似乎让 Backbone 感到困惑：见这个演示http://jsfiddle.net/T3fmx/

为了解决您的难题，您可以：

  • 从服务器响应中删除id属性或分配唯一值，http://jsfiddle.net/T3fmx/3/

  • idAttribute在你的模型中设置一个假的：http: //jsfiddle.net/T3fmx/1/ 

    kronos.Slot = Backbone.Model.extend({
    idAttribute: 'whatever'
});

  • 解析返回的数据以省略id属性：http: //jsfiddle.net/T3fmx/2/

    kronos.Slot = Backbone.Model.extend({
    parse: function(data) {
        return _.omit(data, 'id');
    }
});
于 2013-11-03T15:48:46.400 回答