骨干关系抓取相关不发送请求

Question

我使用backbone.js和骨干关系0.5.0与Rails 3.2后端。我有一个卡模型has_many注释。

这里是我JS模型和集合：

Workflow.Collections.Cards = Backbone.Collection.extend({ 
    model: Workflow.Models.Card, 
    url: '/cards' 
}); 

Workflow.Models.Card = Backbone.RelationalModel.extend({ 
    modelName : 'card', 
    urlRoot  : '/cards', 

    relations: [ 
    { 
    type: Backbone.HasMany, 
    key: 'notes', 
    relatedModel: 'Workflow.Models.Note', 
    collectionType: 'Workflow.Collections.Notes', 
    includeInJSON: false, 
    reverseRelation: { 
     key: 'card', 
     includeInJSON: 'id' 
    } 
    }] 

}); 

Workflow.Collections.Notes = Backbone.Collection.extend({ 
    model: Workflow.Models.Note, 
    url: '/cards/74/notes' // intentionally hard-coded for now 
}); 

Workflow.Models.Note = Backbone.RelationalModel.extend({ 
    modelName : 'note', 
    urlRoot  : '/notes' 
}); 

正常取的伟大工程，但是当我尝试fetchRelated在控制台中，我得到一个空数组：

card = new Workflow.Models.Card({id: 74}) // cool 
card.fetch() // hits the sever with GET "/cards/74" - works great 
card.fetchRelated('notes') // [] - didn't even try to hit the server 

有什么奇怪的是，这个工程：

card.get('notes').fetch() // cool - GET "/cards/74/notes" 

我能使用该方法并解析响应文本，但感觉真的很脏。

任何人都知道我在这里失踪？

在此先感谢，这真是折磨我！

斯图

Answer 1

我应该张贴我的解决办法而回 - 可能会有更好的方式，但这是我已经过去的惯例：

以下所有代码都在卡片视图（这是显示注释的地方）。

首先，我绑定一个renderNotes方法对卡的票据集合'reset'事件：

initialize: function() { 
    _.bindAll(this); 

    this.model.get('notes').on('reset', this.renderNotes); 

    var self = this; 
    this.model.get('notes').on('add', function(addedNote, relatedCollection) { 
     self.renderNote(addedNote); 
    }); 
    } 

我也绑定到'add'上收集调用奇异renderNote。

的renderNotes和renderNote方法的工作方式是这样的：

renderNotes: function() { 
    if (this.model.get('notes')) { 
     this.model.get('notes').each(this.renderNote); 
    } 
    }, 

    renderNote: function (note) { 
    var noteView = new Workflow.Views.Note({ model: note }); 
    this.$('.notes').append(noteView.render().el); 
    }, 

然后，拼图的最后一块是实际点击服务器了该卡的笔记（这将反过来火灾'reset'事件中，我结合到上面）。我这样做的卡片视图的render方法：

render: function() { 
    // render all of the eager-loaded things 
    this.model.get('notes').fetch(); 
    return this; 
    }, 

正如@ user1248256好心帮我在我的OP的意见制定出的混乱主要是在我预料fetchRelated拉下延迟加载的记录 - 这是实际上并非如此。

作为一个侧面说明，这个视图实际上是一个模式，可以打开和关闭（从页面中删除）。为了防止this excellent post中描述的僵尸事件问题，我还手动解除了上述事件。

Answer 2

您应该创建Card与Note ids数组：card = new Workflow.Models.Card({id: 74, notes: [74, 75]});并相应地改变Notes的url方法：

Workflow.Collections.Notes = Backbone.Collection.extend({ 
    model: Workflow.Models.Note 
}); 

Workflow.Models.Note = Backbone.RelationalModel.extend({ 
    modelName : 'note', 
    urlRoot  : function() { 
    return this.get('card').url() + '/notes'; 
} 
}); 

card = new Workflow.Models.Card({id: 74, notes: [74, 75]}); 
card.fetchRelated('notes'); 

http://jsfiddle.net/theotheo/5DAzx/