Javascript 按嵌套JSON（BackboneJS）中的父节点动态筛选

我知道问题的标题有点混乱，所以请原谅-希望我能解释我的问题

我的数据结构如下：

{
  "_data": {
    "Test Alignment Form": [
      {
        "review_form": "Test Alignment Form",
        "rvee_uid": "52",
        "firstName": "Joe",
        "lastName": "Bloggs",
        "status": "NOT_STARTED",
        "status_clean": "Not started"
      },
      {
        "review_form": "Test Alignment Form",
        "rvee_uid": "54",
        "firstName": "Steve",
        "lastName": "Stevenson",
        "status": "NOT_STARTED",
        "status_clean": "Not started"
      },
      {
        "review_form": "Test Alignment Form",
        "rvee_uid": "13",
        "firstName": "Anne",
        "lastName": "Boleyn",
        "status": "COMPLETED",
        "status_clean": "Completed"
      }
    ],
    "Another Form": [
      {
        "review_form": "Another Form",
        "rvee_uid": "10",
        "firstName": "Luther",
        "lastName": "Vandross",
        "status": "NEVER_TOO_MUCH",
        "status_clean": "Never too much, never too much... duh duh duh"
      },
      {
        "review_form": "Another Form",
        "rvee_uid": "54",
        "firstName": "Steve",
        "lastName": "Stevenson",
        "status": "NOT_STARTED",
        "status_clean": "Not started"
      },
      {
        "review_form": "Another Form",
        "rvee_uid": "13",
        "firstName": "Anne",
        "lastName": "Boleyn",
        "status": "COMPLETED",
        "status_clean": "Completed"
      }
    ]
  },
  "_meta": {
    "generated": 1397642209,
    "length": 62,
    "duration": 3,
    "author": 0
  }
}

我的代码现在是这样的：

window.app = app = window.app or
  models:      {}
  collections: {}
  views:       {}
  routes:      {}
  init:        () ->
    console.log 'Initialised app.'
    app._app = new app.views.table()

#-----------------------------------------------------------------------------#

app.models.form = Backbone.RelationalModel.extend
  defaults:
    firstName:    ""
    lastName:     ""
    review_form:  ""
    rvee_uid:     "0"
    status:       ""
    status_clean: "UNKNOWN"

  initialize: () ->
    console.log "Initialised model 'form'."



app.collections.mainCollection = Backbone.Collection.extend
  model: app.models.form
  url: "data/data.json"
  initialize: (models, options) ->
    console.log "Initialised collection 'mainCollection'."
    @options = options

    @fetch reset: true

    @on "reset", () ->
      console.log "Collection reset!"



app.views.tableItem = Backbone.View.extend

  tagName: 'li'

  template: _.template $('#row').html()

  initialize: () ->
    console.log "Initialised view 'tableItem'."

  render: () ->
    console.log "Rendered view 'tableItem'."
    @$el.html @template @model.toJSON()
    @



app.views.table = Backbone.View.extend

  el: '#table'

  initialize: (data) ->
    console.log "Initialised view 'table'."
    @collection = new app.collections.mainCollection data

    @listenTo @collection, 'reset', () ->
      @render()

  render: () ->
    console.log "Rendered view 'table'."
    @$el.empty()
    console.log @collection.models
    _.each @collection.models, (_item) =>
      @renderItem(_item)

  renderItem: (_item) ->
    item = new app.views.tableItem
      model: _item

    @$el.append item.render().el


#-----------------------------------------------------------------------------#

app.init()

（请记住，我有一个更大的工作版本，但是没有嵌套结构，所以这只是用于沙箱）

无论如何，假设我有另一个视图，其中包含一个

select

下拉输入，由“测试对齐表单”和“另一表单”填充。当我选择一个时，我希望返回的模型是该表单的子对象。因此，相当于解析出

@[''u data']['Test Alignment Form']

。我也希望能够访问“_meta”对象，例如，我希望能够在另一个视图中打印生成的日期。有人知道实现这一目标的最佳实践吗？我一直在拔头发

---

谢谢：）所以。。嗯，你有一个收藏的集合。您的数据是一个包含表单的集合。表单是条目的集合

表单集合应包含数据结构

然后它应该制作表单模型。这些表单模型具有条目集合

FormCollection

  parse: (res) ->

    {@_meta} = res
    _.map res._data, (data, formName) =>
      {formName, data}  # we have 2 attributes on the form model

FormModel

  initialize: ->
    @on 'reset', ->
      # Since each form also has a collection of entries, we create a collection
      @entries ?= new EntryCollection
      @entries.parent = this # this circular dependency will create memory leaks
      @entries.reset @get('data'), parse: true #remember data is an array

EntryCollection

  parse: (res) ->
    @meta = parent.collection._meta
    res

EntryModel

EntryCollection

中的模型可以访问

@collection.meta

你应该注意到这种嵌套很容易出现内存泄漏，所以如果你的页面保持打开几天，你应该考虑<代码>删除>父/代码>等等，但是你不必担心。 这只是第一次尝试，您可能会有所改进，但如果您要进一步构建它，您需要为每个对象创建一个模型，并为每个数组创建一个集合。您的_数据实际上是数组

你有

"_data": {
  "Test Alignment Form": [
    {
      "review_form": "Test Alignment Form",
      "rvee_uid": "52",
      "firstName": "Joe",
      "lastName": "Bloggs",
      "status": "NOT_STARTED",
      "status_clean": "Not started"
    },
    {
      "review_form": "Test Alignment Form",
      "rvee_uid": "54",
      "firstName": "Steve",
      "lastName": "Stevenson",
      "status": "NOT_STARTED",
      "status_clean": "Not started"
    },
    {
      "review_form": "Test Alignment Form",
      "rvee_uid": "13",
      "firstName": "Anne",
      "lastName": "Boleyn",
      "status": "COMPLETED",
      "status_clean": "Completed"
    }
  ],
  "Another Form": [
    {
      "review_form": "Another Form",
      "rvee_uid": "10",
      "firstName": "Luther",
      "lastName": "Vandross",
      "status": "NEVER_TOO_MUCH",
      "status_clean": "Never too much, never too much... duh duh duh"
    },
    {
      "review_form": "Another Form",
      "rvee_uid": "54",
      "firstName": "Steve",
      "lastName": "Stevenson",
      "status": "NOT_STARTED",
      "status_clean": "Not started"
    },
    {
      "review_form": "Another Form",
      "rvee_uid": "13",
      "firstName": "Anne",
      "lastName": "Boleyn",
      "status": "COMPLETED",
      "status_clean": "Completed"
    }
  ]
},

应该是

"_data": [
  {
    name: "Test Alignment Form",
    contents: [
      {
        "review_form": "Test Alignment Form",
        "rvee_uid": "52",
        "firstName": "Joe",
        "lastName": "Bloggs",
        "status": "NOT_STARTED",
        "status_clean": "Not started"
      },
      {
        "review_form": "Test Alignment Form",
        "rvee_uid": "54",
        "firstName": "Steve",
        "lastName": "Stevenson",
        "status": "NOT_STARTED",
        "status_clean": "Not started"
      },
      {
        "review_form": "Test Alignment Form",
        "rvee_uid": "13",
        "firstName": "Anne",
        "lastName": "Boleyn",
        "status": "COMPLETED",
        "status_clean": "Completed"
      }
    ],
  },
  {
    name: "Another Form",
    contents: [
      {
        "review_form": "Another Form",
        "rvee_uid": "10",
        "firstName": "Luther",
        "lastName": "Vandross",
        "status": "NEVER_TOO_MUCH",
        "status_clean": "Never too much, never too much... duh duh duh"
      },
      {
        "review_form": "Another Form",
        "rvee_uid": "54",
        "firstName": "Steve",
        "lastName": "Stevenson",
        "status": "NOT_STARTED",
        "status_clean": "Not started"
      },
      {
        "review_form": "Another Form",
        "rvee_uid": "13",
        "firstName": "Anne",
        "lastName": "Boleyn",
        "status": "COMPLETED",
        "status_clean": "Completed"
      }
    ],
  },
];

除非我有误解，但我认为另一种形式是用户生成的。。可能有无限的形式，对吗

关于你的后续行动

FormView

  render: ->

    @$el.empty().append formTemplate(this)
    @model.entries.each (model) =>

      # if you need more speed or re-render often, you can cache these views later
      entryView = new EntryView {model}
      # assumes you have an entries-container in your form template
      @$('.entries-container').append entryView.render().el

---

谢谢你的回复！我得去看场戏，然后再打给你。是的，表格和条目的数量可以是任意长度。顺便问一下，行

.map@\u data，（data，formName）=>

实际上应该是

.map res.\u data，（data，formName）=>

？还是我遗漏了什么？再次感谢。啊，是的，应该这样做，但是你可能可以在服务器端修复它，然后删除整个

映射。所以，如果你不介意进一步的帮助，我还有一个问题。它似乎已经完成了子集合。。。有点。但是我很难获得某些视图来显示嵌套的集合。我开始用木偶来做这件事，看看它是否有用，这是源代码：（参见第90行）-我希望下拉列表中填充表单名称，当选中时，我希望表（以及任何其他未来视图）中填充数据。请问我怎么做？谢谢您将拥有一个
FormView
和一个
EntryView
。
FormView
将呈现
EntryView
s，如果速度成了问题，则可以缓存它们，但如果不取消缓存，或者浏览器具有循环依赖关系，则很容易出现更多内存泄漏。不管怎样，总有5种方法可以做某事。最好的学习方法是使用错误的方法一段时间，然后看看你有多愚蠢，不要再这样做了，所以就试试吧！好吧，我会玩一些。是的，我知道，但不幸的是，公司老板和那些不得不与客户交谈的人对玩弄错误的方法并不那么满意；）顺便说一句，在任何悬赏之前，我会坚持一段时间，但我感谢你的帮助！