SlickGridとMeteor.js反応性コレクションを統合するにはどうすればいいですか？

Question

SlickGridは、テーブルや配列からデータを表示することに重点を置いています。 Meteorはデータを操作することに重点を置いていますが、Minimongoを使用しています。 SlickGridはMinimonogoコレクションとどのように統合でき、高速表示と大量のデータ処理機能を維持できますか？

私の現在のやり方は間違っていて、やや醜いです。私はSlickGridための別の配列があると、更新イベントを処理するためにいくつかのグルーコードを書く：

• はソート：流星によって処理、フル・リフレッシュ（再設定データ）
• 追加/更新/削除トリガ：考え出しますインデックスと
• それを無効にフィルタリング：流星によって処理、私はSlickGridに直接流星データカーソルを結合して、いくつかのグルーコードでのみイベントを処理する方法を（再設定データ）

をフル・リフレッシュをトリガ？ Slick.dataviewを使用できますか？目標は、セルレベルでの更新を処理することです。

Answer 1

Slick.Dataviewを使用すると、コレクションのいくつかの機能（ソート、フィルタリング、CRUD ..）が重複しますが、Slick.Gridとのやり取りの方法を確認する必要があります。

あなたはSlick.Gridコードを見れば、あなたはそれが唯一の .getLength（）、.getItem（）と.getItemMetadata（）と最後のではないデータビューの3つの機能を使用していることがわかります実装するためには必須です。 Slick.Gridは基本的に 'データ'（Dataview）のみを表示する 'ビュー'コンポーネントですが、 'コントローラ'はどこですか？

実際に実装する必要があります。「SlickGrid Example 4」に1つの例があります。あなたが渡している

// wire up model events to drive the grid 
    dataView.onRowCountChanged.subscribe(function (e, args) { 
    grid.updateRowCount(); 
    grid.render(); 
    }); 

    dataView.onRowsChanged.subscribe(function (e, args) { 
    grid.invalidateRows(args.rows); 
    grid.render(); 
    }); 

あなたはデータビューで、更新行を追加、削除するとトリガーされます。この2つのイベント（onRowCountChanged、onRowsChanged）、そこの機能を使用して：その一例の

最も重要な部分は、このスニペットでありますその情報をGridに送信する。

だから、基本的な考え方は、私の知る限りMongo.Cursorがと少し似ている .observeChanges（）が

チェックアウトSlickGridを.onRowsChanged持って見ることができるようにあなたのMongo.Collectionのための同じをすることであり、ドキュメントの最後にあるソースのAPI。さらに精密な制御のための

あなたのグリッドは、効率的に（別の無効化方法に.invalidate（すべての）行（複数可）を使用してみてくださいを更新処理するには）とも.updateRow（）と.updateCell（）。あなたはグリッドとのユーザ対話がイベントをサブスクライブし、それに応じてあなたのコレクションを更新する必要がある場合は

"render": render, 
    "invalidate": invalidate, 
    "invalidateRow": invalidateRow, 
    "invalidateRows": invalidateRows, 
    "invalidateAllRows": invalidateAllRows, 
    "updateCell": updateCell, 
    "updateRow": updateRow, 
    "getViewport": getVisibleRange, 
    "getRenderedRange": getRenderedRange, 
    "resizeCanvas": resizeCanvas, 
    "updateRowCount": updateRowCount, 
    "scrollRowIntoView": scrollRowIntoView, 
    "scrollRowToTop": scrollRowToTop, 
    "scrollCellIntoView": scrollCellIntoView, 
    "getCanvasNode": getCanvasNode, 
    "focus": setFocus, 

：

これらは、主にビューの更新を処理する方法です。

"onScroll": new Slick.Event(), 
    "onSort": new Slick.Event(), 
    "onHeaderMouseEnter": new Slick.Event(), 
    "onHeaderMouseLeave": new Slick.Event(), 
    "onHeaderContextMenu": new Slick.Event(), 
    "onHeaderClick": new Slick.Event(), 
    "onMouseEnter": new Slick.Event(), 
    "onMouseLeave": new Slick.Event(), 
    "onClick": new Slick.Event(), 
    "onDblClick": new Slick.Event(), 
    "onContextMenu": new Slick.Event(), 
    "onKeyDown": new Slick.Event(), 
    "onAddNewRow": new Slick.Event(), 
    "onValidationError": new Slick.Event(), 
    "onViewportChanged": new Slick.Event(), 
    "onColumnsReordered": new Slick.Event(), 
    "onColumnsResized": new Slick.Event(), 
    "onCellChange": new Slick.Event(), 
    "onActiveCellChanged": new Slick.Event(), 
    "onActiveCellPositionChanged": new Slick.Event(), 
    "onDragInit": new Slick.Event(), 
    "onDragStart": new Slick.Event(), 
    "onDrag": new Slick.Event(), 
    "onDragEnd": new Slick.Event(), 
    "onSelectedRowsChanged": new Slick.Event(),