Ember.js Ember数据模型重新加载导致{{each}}中的项被删除/重新插入-丢失当前状态
如果观察到的模型的属性未更改值,我如何防止在迭代控制器的Ember.js Ember数据模型重新加载导致{{each}}中的项被删除/重新插入-丢失当前状态,ember.js,ember-data,Ember.js,Ember Data,如果观察到的模型的属性未更改值,我如何防止在迭代控制器的排列内容时删除项视图,并将其重新渲染回原位 下面的简短版本,使用博客帖子App.post作为示例模型: 控制器: sortProperties: ['createdAt'] 模板: {{each arrangedContent}} {{title}} {{body}} {{/each}} objectAt(0).reload()导致删除相应的项并将其插入回同一位置。问题是itemView会丢失以前的状态,因此结果是一些糟
排列内容时删除项视图
,并将其重新渲染回原位
下面的简短版本,使用博客帖子App.post
作为示例模型:
控制器:
sortProperties: ['createdAt']
模板:
{{each arrangedContent}}
{{title}}
{{body}}
{{/each}}
objectAt(0).reload()
导致删除相应的项并将其插入回同一位置。问题是itemView会丢失以前的状态,因此结果是一些糟糕的用户交互
我追踪到了这一系列的呼叫:
1. retrieved record is pushed onto the store
2. notifyPropertyChange('data') onto the record
3. propertyWillChange('createdAt')
4. arrayWillChange() -> this causes the removal of the item, even though
the value of createdAt didn't change
5. arrayDidChange() -> reinserts the object, it gets re-rendered in the list
当属性没有改变实际值时,我需要它而不是来执行删除/插入序列
一种想法是将删除/插入的内容排入arrayWillChange/arrayDidChange的队列,如果值没有更改,则不调用它们。我怀疑这会导致额外的同步问题。您可能正在为您的收藏使用find
或all
,这使它成为一个实时过滤器(可根据需要将其删除/添加到集合中。您可以将集合移动到普通阵列中,这将删除此逻辑。您可以从路由或控制器中执行此操作
路线
控制器
然后在模板中
{{#each item in simpleModel}}
{{/each}}
注意:执行此操作时,如果将新项目添加到商店,则需要手动将其添加到集合中
App.FooController = Em.ArrayController.extend({
simpleModel: function(){
return this.get('model').toArray();
}.property()
});
{{#each item in simpleModel}}
{{/each}}