Ember.js + jQuery UI Draggable Clone

Question

Ember.jsをjQuery UIのドラッグ可能な機能と併用しようとしていますが、問題が発生しています。具体的には、cloneヘルパーを使用する場合、私は要素を削除することができず、すべてが極端に遅いです。クローンヘルパーを使用しないと、すべて正常に動作します。

これは、（バインディングに使用される）すべてのmetamorphスクリプトタグを含む、htmlをクローニングするjQuery UIに関するものと思われます。

要素をドラッグしている間にライブ要素を更新する必要はありません。バインダータグをemberで取り除く方法はありますか？

didInsertElement: -> 
    @_super() 
    @$().draggable 
    cursor: 'hand' 
    helper: 'clone' 
    opacity: 0.75 
    scope: @draggableScope 
    @$().droppable 
    activeClass: 'dropActive' 
    hoverClass: 'dropHover' 
    drop: @createMatch 
    scope: @droppableScope 

私の最初の考えがしようとすると予期しない動作を防ぐために、ドラッグ中にbeginPropertyChangesとendPropertyChangesを使用していた：

は参考のため、ここでのビューロジックです。これはうまくいかないようではないし、他のバインディングを更新したい場合には理想的です。ここで私はこれを試みた修正されたコードです：

didInsertElement: -> 
    @_super() 
    @$().draggable 
    cursor: 'hand' 
    helper: 'clone' 
    opacity: 0.75 
    scope: @draggableScope 
    start: -> 
     Ember.beginPropertyChanges() 
    stop: -> 
     Ember.endPropertyChanges() 
    @$().droppable 
    activeClass: 'dropActive' 
    hoverClass: 'dropHover' 
    drop: @createMatch 
    scope: @droppableScope 

ご協力いただければ幸いです。

Answer 1

私はすべてのEmber関連のメタデータを手作業で取り除くことによってこれを実現しました。ここで私は手早く小さなjQueryプラグインです：

# Small extension to create a clone of the element without 
# metamorph binding tags and ember metadata 

$.fn.extend 
    safeClone: -> 
    clone = $(@).clone() 

    # remove content bindings 
    clone.find('script[id^=metamorph]').remove() 

    # remove attr bindings 
    clone.find('*').each -> 
     $this = $(@) 
     $.each $this[0].attributes, (index, attr) -> 
     return if attr.name.indexOf('data-bindattr') == -1 
     $this.removeAttr(attr.name) 

    # remove ember IDs 
    clone.find('[id^=ember]').removeAttr('id') 
    clone 

それが動作するように取得するには、単に次のようにヘルパーを設定します。

helper: -> 
    $this.safeClone() 

Answer 2

私はエンバーを使用して、同じ問題を抱えていたRC6 1.0.0。私はクローンを返す関数でクローン文字列を置き換えるだけで正常に動作することを発見しました。 CoffeeScriptの

@$().draggable 
    # helper: 'clone' 
    helper: -> 
     $(@).clone()