問題タブ [gridster]

<li>グリッドスター グリッドが機能しており、サイズ変更されたアイテムの ID を取得しようとしています。

resize: { enabled: true, stop: function (e, ui, $widget) {
//Need the id of the item that was just resized } }

初めての Javascript プロジェクトの 1 つに Gridster を使用していますが、問題が発生しました。

グリッドにウィジェットを追加すると、目的の場所に移動しません。これは、私のプロジェクトのサンプルのjsfiddleです。

ドロップ ゾーンにドラッグ アンド ドロップすると、ウィジェットが作成されますが、正しい位置に配置されません。むしろ、グリッドの外に配置しています。手動で移動すると、グリッドに入ります。新しいウィジェットを追加すると、最初の列と行に配置すると、最初のウィジェットの背後にあることがわかります。

質問

これを修正するにはどうすればよいですか?

私は Emberjs と Gridsterjs を使用して、ある種のエディターを作成しています。Emberjs に jQuery プラグインを含めるには、コンポーネントを作成する必要があることがわかりました。そのコンポーネント内には、Gridster のウィジェットになる多数のコンポーネントがあります。

これが私のテンプレートのセットアップ方法です：

これで、ユーザーがウィジェットを Gridster に追加できるようにするボタンを作成しましたが、コンポーネントからウィジェットに要求された HTML 文字列を与える方法を見つけることができません。

私はこれを試しました：

この：

しかし、それはうまくいきません。

質問
私の質問は、グリッドスターが期待する html 文字列を作成し、コンテンツを編集するための残り火機能を維持するにはどうすればよいかということです。

HighStocks の株価チャートを gridster と一緒に使用しています。gridster の個々のブロックは、自由にドラッグできます。ただし、株価のタイム スライダー ガジェットもドラッグおよびサイズ変更可能です。グリッドスター ウィジェットの上にあるので、スライダーをドラッグすると、ウィジェット全体も動きます。私の要点を示すために JSFiddle を含めました。 http://jsfiddle.net/faPrd/

要素がそれほど多くないため、この Fiddle ではそれほど顕著ではありませんが、スライダーをドラッグすると、ガジェット全体が多少移動することが既にわかります。どうすればこれを防ぐことができますか?

私のHTML：

グリッドスター用の私のJavascript：

私はこのコードセットを継承し、何が起こっているのか理解していると思いますが、カスタムの $compile ディレクティブ内で ng-show を動作させることができないようです。グリッドスターと関係があるのではないかと思いますが、同じ効果を得るためにコメントアウトされている行を試しました。

私が取り組んでいるコードを公開することはできないので、これは非常に単純化されたバージョンです。私は実際に恐竜アプリを作っているわけではありませんが、それはいいかもしれません。

各結果をグリッドスターに追加する必要があるため、これには templateUrl を使用できません。さらに多くのことが起こっています。私ができないことをただ信じてください:(

ページは次のように始まります。

恐竜 Web サービスが終了し、$watch を押すと、ページは最終的に次のようになります。

問題は、isExtinct メソッドが呼び出されないことです。

次のことを試してみましたが、対応する結果が得られました。

1. isExtinct を 'tarpit' に移動 - 実行されますが、自分がどの恐竜であるかというコンテキストが失われます。$element を渡そうとしましたが、未定義のままです。
2. ng-show="$parent.isExtinct()" - 呼び出されません。
3. メソッドの代わりにフラグを使用します。上記と同じ結果です。
4. tarpit ディレクティブ内の controller() に isExtinct を配置します。#1と同じ結果。メソッドが呼び出されますが、どの恐竜がそれを呼び出したかはわかりません。

$element を親メソッドに渡すか、attr.dinosaurId だけを渡すなど、自分がどの恐竜であるかを把握できる限り、この時点で #1 に落ち着きます。 グリッドスターがそれらを再配置するため、それらが恐竜の配列にマッピングされている順序に依存することはできません。

私はドラッグアンドドロッププロジェクトに参加しており、グリッドスターを使用しています。そして、確認してから動く必要があるのですが、あまりスマートではありません。クリックイベントを使用しましたが、イベントのアイデアが役立ちます。これが私のJSコードです。助けてくれてどうもありがとう