＆＃39;电子表格＆＃39;数据模型与Ember-Data

Question

我正在尝试代表一个电子表格＆＃39;就像使用ember-data的数据模型一样。

这样做的主要原因是我想将.CSV数据加载到此模型结构中，并从面向列和面向行的角度查看数据。

我不知道.CSV的内容是什么，所以基于行的列名称的数据模型不起作用，正如我所理解的那样。

我有四个主要模型：

App.DataSet = DS.Model.extend({
  name: attr('string'),
  columns: hasMany('column', {async:true}),
  rows: hasMany('row', {async:true})
});

App.Column = DS.Model.extend({
  dataSet: belongsTo('data-set'),
  name: attr(),
  cells: hasMany('cells',{async:true})
});

App.Row = DS.Model.extend({
  dataSet: belongsTo('data-set'),  
  cells: hasMany('cell',{async:true})
});

App.Cell = DS.Model.extend({
  row: belongsTo('row'),
  column: belongsTo('column'),
  value: attr()
});

我为模型创建了一些FIXTURE数据，它似乎有效（尽管欢迎任何有关更好方法的建议！）。

我现在正试图在表格中显示数据。我的索引控制器是一个ArrayController，它从商店中查找“数据集”。我的模板看起来像：

<div>
  <h1>Data/h1>
  <ul>
  {{#each d in model}}
  <li>
    {{d.name}}
    <br>

    <table>
      <thead>
        <tr>{{#each col in d.columns}}<td>{{col.name}}</td>{{/each}}</tr>
      </thead>
      <tbody>
        {{#each row in d.rows}}
          <tr>
            {{#each cell in row.cells}}<td>{{cell.column.id}}&nbsp;{{cell.value}}</td>{{/each}}
          </tr>
        {{/each}}
      </tbody>
    </table>
  </li>
  {{/each}}
  <ul>
</div>

当渲染它时，我发现对于某些行，单元格相对于列正确排序，但在其他行中它们不是。我提供了一个截图，以明确这一点。

如何按正确的列顺序渲染每个单元格？

谢谢，

迈克尔