1

我正在尝试将 Backbone 与 REST API 一起使用：

这里的代码

我的模型：

var PagesModel = Backbone.Model.extend({
    idAttribute: 'Guid',
    initialize: function () {
        this.on('remove', this.destroy);
    },
    urlRoot: '/api/pages'
});

收藏：

var PagesCollection = Backbone.Collection.extend({
        model: PagesModel,
        url: '/api/pages'
    });

看法：

var PagesView = Backbone.View.extend({
    el: '#pages',
    events: {
        'click .removePage': 'remove',
    },
    initialize: function (collection) {
        this.collection = collection;
        this.collection.fetch();
        this.template = $('#pages-template').html();
        this.collection.bind('change reset', this.render, this);

    },
    render: function () {
        var template = _.template(this.template);
        $(this.el).html(template({ pages: this.collection.toJSON() }));
        return this;
    },
    remove: function (e) {
        e.preventDefault();
        var id = $(e.currentTarget).closest('ul').data("id");
        var item = this.collection.get(id);
        this.collection.remove(item);
        $(e.currentTarget).closest('ul').fadeOut(300, function () {
            $(this).remove();
        });
    }
});

在这里我正在启动应用程序：

$(function () {
    var pagesCollection = new PagesCollection();
    var pagesView = new PagesView(pagesCollection);
});

我单击或删除并在网络检查器中看到此链接

http://localhost:54286/backbone/function%20()%20%7B%20%20%20%20%20%20var%20base%20=%20getValue(this,%20'urlRoot')%20%7C%7C%20getValue(this.collection,%20'url')%20%7C%7C%20urlError();%20%20%20%20%20%20if%20(this.isNew())%20return%20base;%20%20%20%20%20%20return%20base%20+%20(base.charAt(base.length%20-%201)%20==%20'/'%20?%20''%20:%20'/')%20+%20encodeURIComponent(this.id);%20%20%20%20}

而不是 /api/pages/{guid}。

我做错了什么？

4

2 回答 2

1

我还没有完全弄清楚为什么，但是您可以通过在模型移除结束后remove销毁模型来使其工作（Backbone 在触发事件后做最后一件事：销毁模型中的集合引用）。

但更好的是，直接使用destroy模型上的函数，它会自动从集合中删除它（{wait: true}如果需要使用）。

编辑：
终于设法找到问题的根源。其实很简单。要覆盖模型url（用计算urlRoot但没关系），您可以在调用时传递Model#destroy一个url选项Backbone.sync（或将调用它的东西）。
现在你在想“但我没有！”。但你做了。侦听器（Model#destroy在您的情况下）有 3 个参数。Model#destroy将第一个（模型本身）作为options.
这就是失败（我认为 Backbone 需要一个补丁来解决这个问题）：给出一个url选项Backbone.sync是唯一_.result不用于计算 url 的时间。因此，您发现自己拥有模型的 url 属性作为 url，这是您在调用中看到的函数。

现在，快速修复：

this.on('remove', this.destroy.bind(this, {}));

这将确保您Model#destroy调用的第一个参数是{}（以及绑定上下文）。

再忍受我一会儿。

现在，如果您仍然愿意在销毁模型Collection#remove 之前调用，这里有一个小技巧：因为（如上所述）在 Backbone 确保删除模型中的集合引用之前remove触发事件，您不需要模型中的属性。实际上，模型将不再在集合中，但 Backbone 仍会考虑集合的 url 以获取模型的 url（因为引用仍然存在）。urlRoot

于 2013-06-06T13:39:40.843 回答
0

不是一个确定的答案，但只是通过您问题中的代码和主干.js 文档，问题可能是您命名了您的方法remove，而这妨碍remove了Backbone.View.

http://backbonejs.org/#View-remove

更新：

看起来您在网络检查器中看到的输出Backbone.Model.url是正在附加函数的定义。含义url没有被正确调用（也许()调用者丢失了？）。您是否覆盖Backbone.sync了应用程序中的任何位置？

于 2013-06-06T12:30:32.717 回答