コンソールに次のエラーが表示されます。
Assertion failed: The value that #each loops over must be an Array. You passed (generated home controller)
Uncaught TypeError: Object [object Object] has no method 'addArrayObserver'
私のHTMLは次のようになります。
<script type="text/x-handlebars">
<div id="top-panel">
<h1>{{{title}}}</h1>
</div>
<div id="wrapper">
<div id="content">
{{outlet}}
</div>
</div>
</script>
<script type="text/x-handlebars" id="home">
<table>
<thead>
<tr>
<th>Id</th>
<th>Foo</th>
<th>Bar</th>
<th>Foo Bar</th>
</tr>
</thead>
<tbody>
{{#each}}
<tr>
<td>{{itemId}}</td>
<td>foo</td>
<td>foo</td>
<td>foo</td>
</tr>
{{/each}}
</tbody>
</table>
</script>
ホーム ルートを次のように定義しました。
App.Router.map(function () {
this.resource("home", { path: "/" });
});
App.HomeRoute = Ember.Route.extend({
model: function () {
$.getJSON("mocks/items.json", function (items) {
console.log(items);
return items;
});
}
});
console.log(items) はコンソールにオブジェクトの配列を記録するので、正しいです。ホーム テンプレートの each ループが機能しない理由がわかりません。