如何处理属于Backbone js并且有很多关系

时间:2014-02-03 12:08:39

标签: backbone.js coffeescript

我有两个型号,User和Picture。用户有很多图片。我想暂停调用Picture上的后端服务器查询。目前,当我点击暂停按钮时,我得到了用户模型,但我想要图片模型。在我的用户视图中,我有以下代码。

用户视图

class MyApp.Views.User extends Backbone.View

  initialize: ->
    @listenTo(@model, 'change',  @render)
    @listenTo(@model, 'destroy', @remove)

  render: ->
    $(@el).html(@template(user: @model))
    @fetchPictures()
    this

  fetchPictures: ->
    @picture_collection = new MyApp.Collections.Pictures()
    @picture_collection.fetch({ 
    reset: true, 
    data: { "user_id": @model.get("objectId") }#,
    success: (e) ->
      for picture in e.models
        view = new MyApp.Views.Picture(model: picture)
        $("#objects-info").html(view.render().el)
    })

图片视图

class MyApp.Views.Picture extends Backbone.View
  template: JST['flagged_objects/picture']
  el: 'td'
  events: ->
    "click #Picure": "deletePicture"

  initialize: ->
    @model.set('id', this.model.get('objectId'))
    @listenTo(@model, 'change',  @render)
    @listenTo(@model, 'destroy', @remove)

  render: ->
    $("#object-info").append(@template(entry: @model))
    this

  deletePicture: (e) ->
    e.preventDefault()
    console.log @

图片收藏

class MyApp.Collections.Pictures extends Backbone.Collection
  model: MyApp.Models.Picture
  url: "/api/pictures"

PICUTRE模型

class MyAdmin.Models.Picture extends Backbone.Model
  urlRoot: 'api/picture'
  idAttribute: 'objectId'

在@model变量的 USER VIEW 中,我获得了用户模型。有没有办法在这里获得图片模型,以便我可以发送呼叫暂停图片。

总之,我只想按暂停按钮暂停图片模型obejct。 Suspend本质上是一个更新调用。

谢谢,

1 个答案:

答案 0 :(得分:1)

正如我们在评论中所说,deletePicture函数应该在Picture子视图中,因为你要暂停的是Picture模型。

我认为你所拥有的奇怪行为与你渲染视图的方式有关。

在用户视图中,您应该附加图片子视图。

fetchPictures: ->
  @picture_collection = new MyApp.Collections.Pictures()
  @picture_collection.fetch({ 
  reset: true, 
  data: { "user_id": @model.get("objectId") }#,
  success: (e) ->
    for picture in e.models
      view = new MyApp.Views.Picture(model: picture)
      $("#objects-info").append(view.render().el)
  })

在子视图的渲染中,您可以访问html函数。

render: ->
  this.$el.html(@template(entry: @model))
  this

让我知道它是怎么回事!