Javascript 随时更新视图';余烬模型的新记录
我有一个简单的Ember.js应用程序。有一个Javascript 随时更新视图';余烬模型的新记录,javascript,ember.js,ember-model,Javascript,Ember.js,Ember Model,我有一个简单的Ember.js应用程序。有一个应用程序视图,在该视图中有一个结果视图 我使用ember模型以这种方式从服务器获取JSON: Map.Winery = Ember.Model.extend({ name: Ember.attr(), address: Ember.attr(), address_2: Ember.attr(), city: Ember.attr(), stateprovi
应用程序视图
,在该视图中有一个结果视图
我使用ember模型以这种方式从服务器获取JSON:
Map.Winery = Ember.Model.extend({
name: Ember.attr(),
address: Ember.attr(),
address_2: Ember.attr(),
city: Ember.attr(),
stateprovince: Ember.attr(),
country: Ember.attr(),
latitude: Ember.attr(),
longitude: Ember.attr(),
full_address: function () {
return this.get('address') + ' ' + this.get('city') + ' ' + this.get('stateprovince') + ' ' + this.get('country');
}.observes('address', 'city', 'stateprovince', 'country')
});
Map.Winery.adapter = Ember.Adapter.create({
findAll: function(klass, records) {
return Ember.$.getJSON('/api/wineries').then(function(response) {
if (response.success) {
records.load(klass, response.data);
}
});
}
});
我尽可能地简化了它,这样人们就可以公平地看待正在发生的事情
所以基本上,我在应用程序视图中有一个按钮,每当我单击时,它都会调用一个调用Map.Winery.findAll()的操作;(从服务器重新加载数据)
我想要的是,每当记录中加载了新数据时,results视图
都应该用新的结果更新
应用程序.hbs
<button class="locate" {{action "reload" on="click"}}>Reload</button>
{{view Map.ResultsView}}
Map.ApplicationController = Ember.ObjectController.extend({
actions: {
reload: function() {
var results = Map.Winery.findAll();
}
}
});
<div class="results">
{{#each results}}
<p>{{this}}</p>
{{/each}}
</div>
Map.ResultsView = Ember.View.extend({
templateName: 'results',
didInsertElement: function(e) {
}
});
结果。哈佛商学院
<button class="locate" {{action "reload" on="click"}}>Reload</button>
{{view Map.ResultsView}}
Map.ApplicationController = Ember.ObjectController.extend({
actions: {
reload: function() {
var results = Map.Winery.findAll();
}
}
});
<div class="results">
{{#each results}}
<p>{{this}}</p>
{{/each}}
</div>
Map.ResultsView = Ember.View.extend({
templateName: 'results',
didInsertElement: function(e) {
}
});
现在的问题是:每当有新数据从服务器加载到记录时,结果视图都会更新,我该如何做到这一点
我试着插入尽可能多的相关代码,随时可以问任何问题
谢谢只需将新对象推送到您的集合中(或将集合替换为findAll的新集合)
我发现最好的方法是在需要触发的任何事件中添加一个事件,并在需要时使用该触发器 使用余烬事件:
App.ApplicationController = Ember.ObjectController.extend(Ember.Evented, {
viewUpdated: function(args) {}
/* controller stuff here */
});
我现在几乎可以在任何地方添加这样的事件:
this.get('controller').on('viewUpdated', $.proxy(this.viewUpdated, this));
因此,每当我必须触发视图进行更新时,我会:
this.get('controllers.application').trigger('viewUpdated', args);
(顺便说一下,args是可选的)
这样,只要我愿意,事件就会被触发。它没有观察者那么强大,但它仍然做得很好