2017-07-15 16 views
0

ngx-perfect-scrollbarag-gridに適用しようとしています。私は両方とも別々に作業することができますが、私は完璧なスクロールバーでデータテーブルのデフォルトのスクロールバーを完全に置き換えたいと思っています。ag-gridにngx-perfectスクロールバーを適用するには

私はtheir instructionsごとに私のモジュールを設定している:これは、単に新しいカスタムスクロールバーで表示される外側の要素になり

<perfect-scrollbar class="psc"> 
    <ag-grid-angular #agGrid style="width:100%;height:100%" class="ag-dark" 
        [gridOptions]="gridOptions" 
        [rowData]="rowData"> 
    </ag-grid-angular> 
</perfect-scrollbar> 

、データグリッドを含む:

import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar'; 
import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar'; 

const PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = { 
    suppressScrollX: true 
}; 

@NgModule({ 
    declarations: [ 

    ], 
    imports: [ 
    PerfectScrollbarModule.forRoot(PERFECT_SCROLLBAR_CONFIG) 
    ] 
}) 

を、私のテンプレートで標準のツールバーを使用します。どちらのディレクティブも同じ要素に適用する必要がありますが、これを行う方法については迷っています。

私はまた、this approachをしようと、標準(非角度)パーフェクト・スクロールバーのパッケージを使用して、コンポーネントがロードされたときに正しい.ag-body-viewport要素にバインドしようとしていた。「

import perfectScrollbar from 'perfectScrollbar'; 

this.viewport = this.$element.find('.ag-body-viewport')[0]; 
perfectScrollbar.initialize(this.viewport); 

が、私はすることができますどちらかを稼働させる。私はちょうど "デフォルトの輸出"エラーを得る...

すべてのポインタが高く評価されています。おかげ

答えて

0

は、このような完璧なスクロールバーをインポートしよう:

import * as perfectScrollbar from 'perfect-scrollbar'; 

、あなたがperfectScrollbar.initialize()とperfectScrollbar.update()で行くことができます。

関連する問題