1

我是 Ember 和 Handlebars 的新手。我正在尝试创建一个包含动态内容的表格。我将代码添加到jsfiddle

我有以下代码：

<script type="text/x-handlebars">
<table border="1" bordercolor="FFCC00" style="background-color:FFFFCC" width="400" cellpadding="3" cellspacing="3">
  {{#each Table.tableController}}
  <tbody>
<tr>
    <td width ="30%">{{title}}</td>
    <td width ="30%">{{artist}}</td>
            <td width ="40%">{{genre}}</td>
</tr>
   </tbody>
  {{/each}}
</table>

一个简单的表格，绑定了我的控制器中的内容。

这是我的控制器和应用程序：

Table = Ember.Application.create({});

Table.Cell = Ember.Object.extend({
title: null,
artist: null,
genre: null,
listens: 0
});

Table.tableController = Ember.ArrayProxy.create({
content: [],
init: function() {
    var data = Table.Cell.create({
    title: 'Ruby',
    artist: 'Kaiser Chiefs',
    genre: 'Indie Rock',
        });
    this.pushObject(data);
    data = Table.Cell.create({
    title: 'Somebody Told Me',
    artist: 'Killers',
    genre: 'Indie Rock',
        });
        this.pushObject(data);
    },
    createSong: function(title, artist, genre) {
    var cell = Table.Cell.create({
    title: title,
    artist: artist,
    genre: genre,
        });
    this.pushObject(cell);
    },
});

这工作得很好。

现在我想添加一首新歌，我通过 Chrome 控制台使用以下行来执行此操作：

 Table.tableController.createSong('Feiticeira', 'Deftones', 'Alternative');

我可以验证是否创建了一个新对象并将其插入到我的内容数组中。但是我的表没有任何变化。

我究竟做错了什么？为什么我的表没有创建新内容？

我将此代码推送到 jsfiddle 以帮助您帮助我。 这是代码的链接。

4

1 回答 1

3

更新分析

您忘记调用this._super();，init这会阻止您的实例进行绑定管理设置。（固定修订）

您在一个典型的 Ember 陷阱中感觉到：初始值永远不应该是对象，因为它们将被所有类实例共享...有关更多信息，请参阅本文。

FIX SAMPLE -仍然推荐实施

更新了您的 JSFiddle @ http://jsfiddle.net/MikeAski/AgyAk/12/并进行了一些改进（最值得注意的是：使用控制器而不是直接使用控制器ArrayProxy。它更符合习惯并准备好切换到Router基础架构）。

于 2012-07-23T13:22:38.160 回答