我有一个模型Category
有很多Documents
. 渲染个人时,Category
我想documents
在拖放可排序列表中列出所有孩子。我还想双击任何个人document
以允许对该文档进行内联编辑。
我让两个部分都在那里工作,但似乎无法弄清楚如何将它们合并在一起。
对于可排序列表,我使用自定义子类CollectionView
来呈现documents
,并在插入元素后调用 html5sortable jquery 插件。
对于内联编辑,我itemController
为每个document
正在渲染的内容设置了一个。在DocumentController
我保持编辑文档的应用程序状态。
我正在寻找有关如何结合这两种方法的见解。我认为我需要的是一种itemController
在. 我已将相关代码放在下面。itemView
CollectionView
App.SortableView = Ember.CollectionView.extend({
tagName: 'ul',
itemViewClass: 'App.SortableItemView',
didInsertElement: function(){
var view = this;
Ember.run.next(function() {
$(view.get('element')).sortable();
});
}
});
App.SortableItemView = Ember.View.extend({
templateName: 'sortable-item',
doubleClick: function() {
//This should ideally send 'editDocument' to controller
}
});
App.DocumentController = Ember.ObjectController.extend({
isEditing:false,
editDocument: function () {
this.set('isEditing', true);
},
finishedEditing: function() {
var model = this.get('model');
model.get('store').commit();
this.set('isEditing', false);
}
});
<script type="text/x-handlebars" data-template-name="category">
<h1>{{ name }}</h1>
<h2>Documents</h2>
<!-- This makes a sortable list -->
{{view App.SortableView contentBinding="documents"}}
<!-- This makes an editable list -->
{{#each documents itemController="document"}}
<!-- change markup dependent on isEditing being true or false -->
{{/each}}
<!-- How do I combine the two -->
</script>
谢谢你的帮助。真的很感激。