我有这样的模板,
<div>
{{#each model as |item|}}
{{#view "selection" model=item}}
<div class="child_div">{{item.name}}</div>
{{/view}}
{{/each}}
</div>
在我的js中,我使用一个视图来选择一个被点击的元素,如
型号:
App.IndexRoute = Ember.Route.extend({
model: function() {
return [{'is_active':false, 'name':'One'}, {'is_active':false, 'name':'Two'}, {'is_active':false, 'name':'Three'}, {'is_active':false, 'name':'Four'},{'is_active':false, 'name':'Five'}];
}
});
选择视图:
App.SelectionView = Ember.View.extend({
classNameBindings: ["isActive"],
isActive: Ember.computed.alias('model.is_active'), // No I18N
click: function (){
var self = this; self.get("controller").setEach("is_active", false); // No I18N
self.toggleProperty("isActive"); // No I18N
}
});
在这里,我在点击事件中选择了div。当我使用鼠标拖动时,我需要选择它们。
如何使用鼠标拖动选择来做到这一点?请帮助我。
DEMO:JSBIN
答案 0 :(得分:0)
将draggable
属性添加到您的视图并使用dragStart
事件。
attributeBindings : [ 'draggable' ],
draggable : 'true',
dragStart: function(event) {
var self = this;
self.get("controller").setEach("is_active", false); // No I18N
self.toggleProperty("isActive");
}
<强> Here is working demo. 强>
Here is a good article from Lauren Tan on drag n drop in Ember.