問題タブ [angular-cdk-drag-drop]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angular - @angular/cdk を使用したドラッグ ドロップでドロップのイベント データが正しくない
ドラッグドロップの例を見てきましたが@angular/cdk
、ほとんどすべてがリストの並べ替えと、異なるリスト間でのアイテムのドラッグに関するものです。
アイテムのリスト (ファイルまたはフォルダーとして指定された各アイテム)があり、リストの1 つ以上のファイル アイテムをドラッグして、同じリスト内のフォルダーアイテム...そしてそこに移動します(もちろん、API呼び出しによって処理されます)。
そのため、通常の並べ替えの実装は機能しません (並べ替え可能なリスト内のアイテムは、ホバー時に邪魔にならないように移動します)。
SO に関するいくつかの質問をして、各項目を としてマークする必要があることを理解しましたcdkDropList
。だから、これはこれまでの私の実装です:
ただし、イベント データには、ドラッグされているアイテム (ファイル アイテム) に関する情報しかありません。以下のコードでは、、、event.previousContainer.data
およびevent.container.data
すべてitem
が同じオブジェクト (ドロップされるファイル項目) を参照しています。
ここで正確に何が間違っているのか教えてください。ありがとう。
編集: これは stackblitz での複製です: https://stackblitz.com/edit/angular-ivy-edaftg
angular - ngbDropdown が cdkDrag Angular 11.0.3 で動作しない
ngbDropdown
メニュー項目をクリックしても閉じません。外側のcdkdrag
div は正常に機能しますが、cdkdrag の内側では機能しません。cdkDrag を削除してみましたが、正常に動作しました。と のバージョンも変更しようとしましngbDropdown
たcdkDrag
。で手動インストールbootstrap
を使用する場合も正常に機能しますjQuery
。
angular - Angular Material Multi Drag Drop、ドラッグドロップを特定のドロップリストのみに制限
親愛なるすべての Angular グル...
オンラインで素晴らしいAngular Materialマルチドラッグドロップの例を見つけたので、ListAからListBへのドラッグドロップのみを許可し、ListBからListAへのドラッグドロップを無効にしたいと考えていました。(スタックブリッツのリンクを下に添付)
何時間も試してみましたが、まだこれを理解できませんでした... Angular の専門家がこれについて私を助けることができますか?