Databases
StackOverflow2013
Postsdbo
POHow to create nested models in Ember.js?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to create nested models in Ember.js?
    primarykey
    data
    text
    <p>Going through Ember.js documentation, I am not able to figure out how to create nested models. Assume that I have the following JSON:</p> <pre><code>App.jsonObject = { id: 1812, name: 'Brokerage Account', positions: [ { symbol: 'AAPL', quantity: '300' }, { symbol: 'GOOG', quantity: '500' } ] } </code></pre> <p>If I create a model object like this</p> <pre><code>App.account = Ember.Object.create(App.jsonObject); </code></pre> <p>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)?</p> <p>I have created a jsfiddle to experiment with this: <a href="http://jsfiddle.net/nareshbhatia/357sg/">http://jsfiddle.net/nareshbhatia/357sg/</a>. 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.</p> <p>Thanks.</p> <p>Naresh</p> <p><strong>Edit:</strong> 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?</p> <pre><code>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); </code></pre> <p>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 <a href="https://code.google.com/p/archfirst/source/browse/trunk/dotnet/Projects/Bullsfirst/Silverlight/Bullsfirst.Module.Positions/Views/PositionsView.xaml">here</a> - it is not too difficult to follow. I am wondering if something like this is possible in Ember.js.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USNaresh
    1. USNaresh
    plurals
    1. This table or related slice is empty.
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow to create nested models in Ember.js?
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POHow to create nested models in Ember.js?
      1. USPaweł Gościcki
      1. VTFavorite
    3. VO
      singulars
      1. POHow to create nested models in Ember.js?
      1. This table or related slice is empty.
      1. VTUpMod
    1. COI'm not very familiar with WPF or it's controls (haven't worked w/ it in almost 4 years), but it looks like something like that should be not too bad to implement in Ember & Handlebars.
      singulars
      1. POHow to create nested models in Ember.js?
      1. USRoy Daniels
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload