这是基本设置:
- 我使用一个简单的计算属性将一组 ember-data 模型绑定到我的车把模板
- 在我通过 xhr 获取模型之前,我会根据一些配置添加一些模型
- 解决 xhr 后,我需要将任何配置模型替换为通过网络返回的对象
- 这似乎确实有效,因为在内存中我可以看到我的计算属性只有 2 个项目,但我的车把模板似乎显示 3(在 xhr 返回后实际从数组中删除的配置模型之一)
我验证了上面的#如下
a.) 在我要求的 chrome 开发工具中
App.Day.find(1).get('listings').get('length'); //在xhr之后返回2
b.) 我也做了以下
App.Appointment.all().get('length'); //在xhr之后返回2
**这里是代码**
我有以下车把模板(显示 3 个项目而不是 2 个)
{{#each appointment in day.listings}}
{{appointment.start}}<br />
{{/each}}
我的日模型上的列表计算属性看起来像这样
App.Day = DS.Model.extend({
name: DS.attr('string'),
appointments: function() {
return App.Appointment.find();
}.property(),
listings: function() {
//pretend we need to add some values in memory before we fire the xhr ...
App.Appointment.add({name: 'first'});
return this.get('appointments');
}.property().volatile()
});
约会模型是一个 ember-data 模型,但是因为我需要动态替换内存中的项目,所以我重写了 find 方法(并在我自己的 add 方法中存根以更好地控制数组)
App.Appointment = DS.Model.extend({
name: DS.attr('string')
}).reopenClass({
records: [],
find: function() {
var self = this;
self.records.clear();
$.getJSON('/api/appointments/', function(response) {
for(var i = 0; i < response.length; i++) {
for(var j = 0; j < self.records.get('length'); j++) {
if (self.records[j].get('name') === response[i].name) {
//now that our xhr has finished we need to replace any that already exist
self.records.splice(j, 1);
}
}
}
});
return this.records;
},
all: function() {
return this.records;
},
add: function(record) {
this.records.addObject(App.Appointment.createRecord(record));
}
});