問題タブ [ng2-dragula]

質問する

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.

133 問題
Newest
Active
Bountied
318
Unanswered
0 投票する
0 に答える
366 参照

html - 動的に div をコンテナーに追加し、すべて同じ幅にします

ドラッグラで他の div をドロップしたいコンテナがあります。ドロップされた div は、可能であればすべて同じ幅になります (コンテナーの幅 > div の最小幅の合計)。

フレックスボックスを使用すると、これは機能しません (テーブルやリストなどの他のオプションも機能しませんでした)。最初のドロップでは、このドロップされた div が必要に応じて幅の 100% を取ります。ただし、次の div をドロップした後、最初の div のサイズは変更されず、後続のすべての div は最小サイズのみになります。また、コンテナーは、追加のドロップごとに成長しています。

ここに私のコンテナと子供たちのスタイルがあります:

これは、子がドロップされるターゲット HTML コードです (私は angular を使用します)。

ここで、stackoverflow で他のさまざまなソリューションをチェックしてテストしましたが、うまくいきませんでした。

0 投票する
1 に答える
1006 参照

angular - ドロップされたソース アイテムのターゲット アイテムの詳細を取得する方法 ( ng2-dragula / angular )

問題: ng2-dragulaドロップ動作を使用して以下を実装する方法が必要です。

  • iOS および Android デバイスのアプリ ランチャーに似たものを構築しようとしています。

  • アイテムAをドラッグして、別の既存のアイテムBの上にドロップしたい.

  • 別のアイテム Bの上に配置すると、両方のアイテムを含むフォルダーアイテムを作成することでこれに対応したいと思います (これは、角度/タイプスクリプトロジックで実装する機能です)。

現在の ng2-dragula ライブラリでは、アイテム Aをドラッグしてアイテム Bにドロップすると 、 onDrop イベントでアイテム A の詳細が表示されますが、アイテム Bを見つける方法はわかりません。

アイテム Bを見つける方法を理解するのに苦労しています。つまり、アイテム Aがドロップされた要素を特定する方法は?

デモ : ドラグラのセットアップと演習を示すデモ プランカーを作成しました。

https://plnkr.co/edit/xXFWfS0Ae8fts2UL94mo

要素にマウスオーバー イベントをアタッチしようとしましたが、後で dragula onDrop イベント内で見つけましたが、要素 B の詳細 (またはアイテム A がドロップされたもの) をキャプチャしません。

どうすればこれを解決できるか教えてください。

ご指導ありがとうございました！


12345678910