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

问题描述

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

  App.jsonObject = {
 id：1812，
 name ：经纪账户，
职位：[
 {
符号：'AAPL'，
数量：'300'
}，
 {
符号：'GOOG'，
数量：'500'
} 
] 
} 
  

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

  App.account = Ember.Object .create（App.jsonObject）; 
  

只有顶级属性（id和name）绑定到模板，嵌套位置数组不正确绑定因此，添加，删除或更新位置不会影响显示。有没有手动或自动的方式来转换位置数组，使其具有绑定感知（类似于WPF中的ObservableCollection）？

我已经创建了一个jsfiddle来实验这一点： http://jsfiddle.net/nareshbhatia/357sg/ 。您可以看到，顶级属性的更改反映在输出中，但对位置的任何更改都不会。我非常感谢任何提示如何做到这一点。

谢谢。

Naresh

编辑：
理想的情况是，如果Ember.js可以以某种方式将我的JSON Feed解析成嵌套的Ember.js对象。例如，如果我明确地定义了我的类，可以帮助Ember.js创建正确的对象？

 应用程序.Account = Ember.Object.extend（{
 id：null，
 name：null，
位置：Ember.ArrayProxy.create（）
}）; 
 
 App.Position = Ember.Object.extend（{
 symbol：null，
 quantity：null，
 lastTrade：null 
}）; 
 
 App.account = App.Account.create（App.jsonObject）; 
  

我的最终目标是在分层网格中显示此结构，可以在帐户级别展开/折叠。来自WPF / Silverlight世界，这样做很容易。所有您需要做的是为XAML中的网格指定嵌套模板，并知道如何解释模型。您可以找到一个例子这里 - 这并不难。我想知道在Ember.js中是否可以这样做。

解决方案

你需要使用 pushObject在使用绑定添加到Ember数组对象时，不是 push 。在访问职位属性时，您应该可以使用 get（）。请参阅我的jsFiddle进行更正。

http：// jsfiddle.net/ud3323/Y5nG5/

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);

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)?

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.

Thanks.

Naresh

Edit: 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);

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.

解决方案

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屋！