如何在 Ember.js 中创建嵌套模型? [英] How to create nested models in Ember.js?

问题描述

通过 Ember.js 文档，我无法弄清楚如何创建嵌套模型.假设我有以下 JSON:

Going through Ember.js documentation, I am not able to figure out how to create nested models. Assume that I have the following JSON:

App.jsonObject = {
    id: 1812,
    name: 'Brokerage Account',
    positions: [
        {
            symbol: 'AAPL',
            quantity: '300'
        },
        {
            symbol: 'GOOG',
            quantity: '500'
        }
    ]
}

如果我创建一个像这样的模型对象

If I create a model object like this

App.account = Ember.Object.create(App.jsonObject);

只有顶级属性(id 和 name)被绑定到模板，嵌套的位置数组没有被正确绑定.因此，添加、删除或更新位置不会影响显示.是否有手动或自动方法来转换位置数组，使其具有绑定意识(类似于 WPF 中的 ObservableCollection)?

only the top level properties (id and name) get bound to templates, the nested positions array does not get bound correctly. As a result adding, deleting or updating positions does not affect the display. Is there a manual or automatic way to transform the positions array so that it is binding aware (similar to an ObservableCollection in WPF)?

我创建了一个 jsfiddle 来试验这个:http://jsfiddle.net/nareshbhatia/357sg/.如您所见，对顶级属性的更改会反映在输出中，但不会对职位进行任何更改.我将不胜感激有关如何执行此操作的任何提示.

I have created a jsfiddle to experiment with this: http://jsfiddle.net/nareshbhatia/357sg/. As you can see, changes to top level properties are reflected in the output, but any change to the positions is not. I would greatly appreciate any hints on how to do this.

谢谢.

纳瑞什

理想的情况是 Ember.js 可以以某种方式将我的 JSON 提要解析为嵌套的 Ember.js 对象.例如，如果我按如下方式明确定义我的类会怎样，这是否可以帮助 Ember.js 创建正确的对象?

The ideal situation would be if Ember.js could somehow parse my JSON feed into nested Ember.js objects. For example, what if I explicitly define my classes as follows, could that assist Ember.js to create the right objects?

App.Account = Ember.Object.extend({
    id: null,
    name: null,
    positions: Ember.ArrayProxy.create()
});

App.Position = Ember.Object.extend({
    symbol: null,
    quantity: null,
    lastTrade: null
});

App.account = App.Account.create(App.jsonObject);

我的最终目标是在可以在帐户级别展开/折叠的分层网格中显示此结构.来自 WPF/Silverlight 世界，做这样的事情相当容易.您需要做的就是在 XAML 中为网格指定一个嵌套模板，它知道如何解释您的模型.您可以找到一个示例 here - 遵循起来并不难.我想知道 Ember.js 中是否可以实现这样的功能.

My eventual goal is to display this structure in a hierarchical grid which can expand/collapse at the account level. Coming from the WPF/Silverlight world, it is fairly easy to do something like this. All you need to do is to specify a nested template for the grid in XAML and it knows how to interpret your model. You can find an example here - it is not too difficult to follow. I am wondering if something like this is possible in Ember.js.

推荐答案

当添加到带有绑定的 Ember 数组对象时，您需要使用 pushObject 而不是 push.并且您可能应该在访问 positions 属性时使用 get().请参阅我的 jsFiddle 以获得更正.

You need to use pushObject not push when adding to Ember array objects with bindings. And you should probably use get() when accessing the positions property. See my jsFiddle for the corrections.

http://jsfiddle.net/ud3323/Y5nG5/

这篇关于如何在 Ember.js 中创建嵌套模型?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！