0

角度uiを使用してリスト間で項目をドラッグアンドドロップすることができます。私ができるようにしたいのは、特定のドラッグ・ドロップ条件の下で確認ダイアログが表示され、ユーザーがダイアログをキャンセルした場合にリストを元の状態に戻すことです。更新イベント内でui.item.sortable.cancel()メソッドを使用できますが、約束を返すモーダルを使用すると、キャンセル時にリストを元に戻す方法がわかりません。私のコントローラには、以下のものがあります(modalServiceはブートストラップ$ uibModalです):角度uiソート可能なコールバック内の確認ダイアログを待つ方法

$scope.sortableOptions = 
     handle: ' > span > span > .task-drag-icon', 
     connectWith: ".task-subset" 
     placeholder: "sortable-placeholder", 
     forcePlaceholderSize: true, 
     update: (e, ui) -> 
      if ui.item.sortable.sourceModel == ui.item.sortable.droptargetModel #sort was within the same list 
      #some other logic here..... 
      else 
      droptarget_element = ui.item.sortable.droptarget 

      if droptarget_element.attr('ng-model') == "task.subTasks" 
       #need the user to confirm here if they really want to do this drag/drop 
       modalOptions = 
       closeButtonText: 'Cancel' 
       actionButtonText: 'Make SubTask' 
       headerText: 'Make SubTask?' 
       bodyText: 'This action will remove any existing task groups as it will become a child task. Is this OK?' 
       modalService.showModal({}, modalOptions).then (result) -> 
        console.log "accpted" 
       ,() -> 
        console.log "cancelled" 
        #need to call ui.item.sortable.cancel() here, but I cant because the update callback has finished already!!!! 

       console.log "finished - gets to here immediately as modalService is asyncronous" 

      return 

アドバイスをいただければ幸いです。

答えて

0

私はいくつかの主要なハッキングなしでは動作しませんでした。代わりに、更新コールバックでcancel()メソッドを使用せずに、適切な配列のデータをeth stopコールバックには次のような変数を代入します。

$scope.sortableOptions = 
     handle: ' > span > span > .task-drag-icon', 
     connectWith: ".task-subset" 
     placeholder: "sortable-placeholder", 
     forcePlaceholderSize: true, 
     stop: (e, ui) -> 
      orig_index = ui.item.sortable.index 
      new_idex = ui.item.sortable.dropindex 
      sourceModel = ui.item.sortable.sourceModel 
      droptargetModel = ui.item.sortable.droptargetModel 
      model = ui.item.sortable.model 

      if sourceModel == droptargetModel #sort was within the same list 
      #some other logic here..... 
      else 
      droptarget_element = ui.item.sortable.droptarget 

      if droptarget_element.attr('ng-model') == "task.subTasks" 
       #need the user to confirm here if they really want to do this drag/drop 
       modalOptions = 
       closeButtonText: 'Cancel' 
       actionButtonText: 'Make SubTask' 
       headerText: 'Make SubTask?' 
       bodyText: 'This action will remove any existing task groups as it will become a child task. Is this OK?' 
       modalService.showModal({}, modalOptions).then (result) -> 
        console.log "accpted" 
       ,() -> 
        #put model back in orginal poisition 
        sourceModel.splice orig_index, 0, model 
        #remove from target array 
        droptargetModel.splice new_idex, 1 

      return 
関連する問題