ember.js - handlebars.js を使用して行内のセルにデータを入力する方法

Question

初めて ember.js/handlebars.js を試しています。非常に簡単ですが、理解できない単純なユース ケースがあります。

次のデータを使用します。

var columns = ['col2', 'col3'], 
  rows = [{
    col1: 1,
    col2: 2,
    col3: 3 },
    {
    col1: 11,
    col2: 12,
    col3: 13 }
    ];

以下を生成するテンプレートを作成するにはどうすればよいですか。

<table>
<tr><td>2</td><td>3</td></tr>
<tr><td>12</td><td>13</td></tr>
</table>

columnsつまり、表示されるセルは配列に基づいているということですか?

Answer 1

これは完全な解決策ではないかもしれませんが、出発点として、次のようにすることができます。

あなたのテンプレートで：

<table>
  {{#each row in model.rows}}
    <tr>
      {{#each col in model.columns}}
        <td>{{row}}</td>
      {{/each}}
    </tr>
  {{/each}}
</table>

そしてあなたのルートであなたのデータを提供してください：

App.IndexRoute = Ember.Route.extend({
  model: function(){
    return Ember.Object.create({
        columns: ['col1', 'col2'],
        rows: [1, 2, 3, 11, 12, 13]
    });
  }
});

ここで動作するjsbin。

それが役に立てば幸い