如何在Ember.js模板中显示hasMany记录?

时间:2013-10-24 20:32:45

标签: javascript json model ember.js ember-data

我的模型定义如下:

App.Question = DS.Model.extend({   
    title: DS.attr( 'string' ),  
    answers: DS.hasMany('App.Answer') 
});

App.Answer = DS.Model.extend({   
    title: DS.attr( 'string' ),  
    wynikid: DS.attr( 'number' ) 
});

从RESTAdapter获取数据,返回如下数据:

{
    "questions": [
        {
            "id": 77,
            "title": "O której wstajesz?",
            "answers": [
                {
                    "id": 159,
                    "title": "O godzinie 6",
                    "wynikid": 57
                },
                {
                    "id": 160,
                    "title": "O godzinie 7",
                    "wynikid": 56
                },
                {
                    "id": 161,
                    "title": "O godzinie 12",
                    "wynikid": 55
                }
            ]
        },
        {
            "id": 76,
            "title": "Kot czy kominiarz?",
            "answers": [
                {
                    "id": 156,
                    "title": "Kocur",
                    "wynikid": 57
                },
                {
                    "id": 157,
                    "title": "Kominiarz",
                    "wynikid": 56
                },
                {
                    "id": 158,
                    "title": "Ani to ani to",
                    "wynikid": 55
                }
            ]
        },
        {
            "id": 75,
            "title": "Wybierz ulubione imię",
            "answers": [
                {
                    "id": 153,
                    "title": "Bożydar",
                    "wynikid": 57
                },
                {
                    "id": 154,
                    "title": "Aleksander",
                    "wynikid": 56
                },
                {
                    "id": 155,
                    "title": "Andrzej",
                    "wynikid": 55
                }
            ]
        },
        {
            "id": 74,
            "title": "Wybierz liczbę",
            "answers": [
                {
                    "id": 152,
                    "title": "Liczba 13",
                    "wynikid": 56
                },
                {
                    "id": 151,
                    "title": "Liczba 7",
                    "wynikid": 55
                },
                {
                    "id": 150,
                    "title": "Liczba 1",
                    "wynikid": 57
                }
            ]
        },
        {
            "id": 78,
            "title": "Ulubiona pora roku",
            "answers": [
                {
                    "id": 162,
                    "title": "To lato",
                    "wynikid": 57
                },
                {
                    "id": 163,
                    "title": "Jesień / Wiosna",
                    "wynikid": 56
                },
                {
                    "id": 164,
                    "title": "To zima",
                    "wynikid": 55
                }
            ]
        }
    ]
}

现在我想要的是显示如下列表:

O której wstajesz?
 O godzinie 6
 O godzinie 7
 ...
Kot czy kominiarz?
 ...

我试过在Ember.js模板中使用它:

 {{#each controller}}

  {{title}}<br>

    {{#each answer in answers}}

    \t{{title}}<br>

    {{/each}}

  {{/each}}

显示问题但答案不是。我在控制台中没有任何错误,JSONLint也没有看到任何JSON问题。

如何让它发挥作用?

我用:

handlebars1.0.0.0.js 烬,1.0.0.0.min.js 余烬数据:v0.13-238-gbf84978

2 个答案:

答案 0 :(得分:0)

最新版本的ember / ember-data不支持嵌入式记录。这是记录here,但我发现解决方法非常笨拙,无法让自己工作。

也许最好的解决方案是侧载您的答案记录,以便它与您的JSON根目录中的问题记录一起显示。这当然是假设您可以控制JSON格式,因此如果不是这样,则此答案不适用。如果您使用的是活动模型序列化程序,则可以通过选项embed: :idinclude: true完成。您将拥有question_serializer.rb类似

的内容
class QuestionSerializer < ActiveModel::Serializer
  attributes :id, :title
  has_many :answers, embed: :id, include: true
end

还有answer_serializer.rb,类似

class AnswerSerializer < ActiveModel::Serializer
  attributes :id, :title, :wynikid
end

我相信它应该有效。我昨天遇到了一个问题并在其上发布了一个stackoverflow问题here,但我今天早些时候发现了我的问题并回答了我自己的问题。我能够得到我的JSON的打印输出,基本上与你试图处理你的把手代码一样!

编辑:语法。

答案 1 :(得分:0)

最新的ember不支持开箱即用的嵌入式记录。但你可以用手解析嵌入

http://emberjs.jsbin.com/AkovAPu/4 - 示例(如果localhost:8888 / questions返回你的json,将会有效 - {“问题”:[...]

http://emberjs.jsbin.com/AkovAPu/4/edit - source(查看extractArray)