0

JSBin 这里: http: //jsbin.com/IYiqifO/16/edit ?html,js,output

我用 DS.FixturesAdapter 中的装置设置了三个相关模型,我试图弄清楚如何从组件中的父模型访问相关模型的属性。我的模板如下所示:

{{#each data}}
  <li>
    <h3>{{name}}</h3>
    {{#each responses}}
      {{text}}<br />
    {{/each}}
  </li>
{{/each}}

而且我在组件中也有一些代码,如下所示:

data = @get('data').map (respondent) ->
  {
    name: respondent.get('name')
    responses: respondent.get('responses').map (r) -> r.get('text')
  }

但 data[n].responses 始终是一个空数组。我需要做什么才能 a) 让我的车把模板填充响应数据;b) 让我的data对象拥有正确填充的responses数组?

4

1 回答 1

2

您需要在Respondent夹具中传递响应 ID:

App.Respondent.FIXTURES = [
    id: 1
    name: 'Ada Lovelace'
    responses: [1,2]
  ,
    id: 2
    name: 'Grace Hopper'
    responses: [3,4]
]

在此之后,您将收到一个错误:

断言失败:您在 '' 上查找了 'responses' 关系,但未加载某些关联记录。要么确保它们都与父记录一起加载,要么指定关系是异步的(DS.hasMany({ async: true })

就像消息中描述的那样,您需要async: true在您的responses财产中使用:

App.Respondent = DS.Model.extend
  name: DS.attr('string')
  responses: DS.hasMany('response', async: true )

在您的模板中,您将看到数据,但是在didInsertElement调用它时,responses不会加载关联。发生这种情况是因为模板具有绑定意识,但 didInsertElement 不是。因此,当responses加载模板更新但不调用 didInsertElement 时。因为responses关联返回一个promise,所以你可以在一个数组中获取所有响应,并使用它Ember.RSVP.all来知道所有响应何时加载:

 App.ShowRespondentsComponent = Ember.Component.extend
  didInsertElement: ->
    allResponses = []
    @get('data').forEach (respondent) =>
      allResponses.push respondent.get('responses')     
    Ember.RSVP.all(allResponses).then =>
      @respondentLoaded()
  respondentLoaded: ->        
    thisIsWhatIWant = @get('data').map (respondent) ->
      {
        name: respondent.get('name')
        responses: respondent.get('responses').map (r) -> r.get('text')
      }
    console.log thisIsWhatIWant

这是一个具有此功能的 jsbin http://jsbin.com/IYiqifO/19/edit

于 2013-10-15T17:49:13.723 回答