私のアプリは、Ember を使用して js を操作し、画面上の要素を移動します。Interact js は、イベント リスナーを使用して項目をドラッグし、ember コンポーネントで top および left プロパティを設定します。これはすべて Ember 1.12 で機能しますが、Ember 2.0 の準備をしようとしています。Ember.View.views[id]
コンポーネントを取得する方法でしたが、Ember.View が機能しなくなりました。コンポーネントは次のとおりです。
/* global interact*/
"use strict";
import Ember from "ember";
export default Ember.Component.extend({
top: 15,
left: 15,
// Initiates interactJS allows the element to be drug around on the canvas
// and restricts the element movement to the canvas.
interactJS: function () {
var self = this,
$self = self.$();
interact(".draggable").draggable({
inertia: false,
autoscroll: true,
restrict: {
restriction: "parent",
elementRect: {
top: 0,
left: 0,
bottom: 0,
right: 0
}
},
onmove: self.dragMoveListener,
}).resizable({
autoscroll: {
container: "parent",
margin: 50,
distance: 5,
interval: 10
}
});
}.on("init"),
// In the event I lose the component so I cannot use this.set("top", y).
dragMoveListener: function (event) {
// This is how I get component currently
var target = event.target,
$comp = Ember.$(target),
compId = $comp.attr("id"),
comp = Ember.View.views[compId], // What should I use instead of Ember.View?
y,
x;
y = comp.get("top") + event.dy;
x = comp.get("left") + event.dx;
comp.set("top", y);
comp.set("left", x);
}
});
イベント中にプロパティを設定できるように、コンポーネントを取得するにはどうすればよいですか? コメントで言ったように、イベントでコンポーネントを失うので、イベントで行うだけthis.set("top", y)
では機能しません。プロパティを設定するには、コンポーネントを取得する必要があります。