0

AngularJS のメイン サイトにあるサンプル コードを使用しています。最初のドラッグ可能なオブジェクトを移動すると、すべて問題ありません。2 番目のオブジェクトをドラッグし始めるとすぐに、2 番目のオブジェクトは最初のオブジェクトが移動された距離だけ「ジャンプ」します。

最初は、変数をリセットするのと同じくらい簡単に修正できると思いました。残念ながら、私の試みはすべて「インデントエラー」を引き起こしました。

# Angular Drag Components RE-uses vars from previous drag, bugging out the dragging
angular.module("aehalo", []).directive "draggable", ($document) ->
  startX = 0
  startY = 0
  x = 0
  y = 0
  (scope, element, attr) ->
    mousemove = (event) ->
      y = event.screenY - startY
      x = event.screenX - startX
      element.css
        top: y + "px"
        left: x + "px"

    mouseup = ->
      $document.unbind "mousemove", mousemove
      $document.unbind "mouseup", mouseup
    element.css
      position: "relative"
      border: "1px solid red"
      backgroundColor: "lightgrey"
      cursor: "pointer"
    element.bind "mousedown", (event) ->
      startX = event.screenX - x
      startY = event.screenY - y
      $document.bind "mousemove", mousemove
      $document.bind "mouseup", mouseup
4

1 に答える 1

2

リセットするように聞こえますが、xそれでも修正されます。ymousedown

    element.bind "mousedown", (event) ->
      x = 0
      y = 0
      startX = event.screenX - x
      startY = event.screenY - y
      $document.bind "mousemove", mousemove
      $document.bind "mouseup", mouseup

それでもインデント エラーが発生する場合は、インデントにタブとスペースが混在していないことを確認してください。

于 2013-03-08T18:22:25.617 に答える