Question

我使用的是Ember版本2，我的组件模板如下所示;

{{#each info as |item|}}
    <span class="value">{{item.value}}</span>
    <span class="label">{{t item.label}}</span>
{{/each}}

现在我想动态地为它写值（即假设它是一个动态总数，最初为0并且根据用户对某些行的选择自动更新）

我的问题是以下代码有效;

var info = self.get('gridParas.info');
info.popObject();
info.pushObject({
    label: 'MyTotalField',
    value: total
});
self.set('gridParas.info', info);

这不起作用;

var info = self.get('gridParas.info');
info.label = "MyTotalField";
info.value = total;
self.set('gridParas.info', info);

popObject（），pushObject（）是正确的方法吗？第二种方法有什么问题？我想避免流行，每次都推。

Answer 1

set()方法通知模型属性已更改，触发模板更新。您可以在更新标签和值后调用notifyPropertyChange('info')或notifyPropertyChange('info.label')，而不是使用它，这应该更新模板。更多信息可以在这里的文档中找到：

http://emberjs.com/api/classes/Ember.Observable.html#method_notifyPropertyChange

Answer 2

您可以直接在最后一个元素上设置属性，而无需弹出和推送：

var info = self.get('gridParas.info');
info.getObjectAt(info.get('length') - 1).setProperties({
  label: 'MyTotalField',
  value: total
});

或者，如果您不想重复使用当前的最后一项，请使用replace：

info.replace(info.get('length') - 1, 1, [{
  label: 'MyTotalField',
  value: total
}]);

正如您所看到的，您需要传递replace索引，要替换的项目数以及数组新项目。

无论如何，你不需要这个：

self.set('gridParas.info', info);

因为那已经是gridParas.info的价值。

灰烬动态更新模板（数组项）

2 个答案: