6

グリッドに動的な高さを持たせたい。angular 1と​​剣道を使用する前に、私はこのようにします。

<kendo-grid id="grid" options="entityGrid.gridOptions"></kendo-grid>

次の CSS を使用します。

#grid {
    height: calc(100% - 1em);
}

しかし、angular2 の Kendo グリッドを使用すると、これを試してもうまくいきません。

<kendo-grid id="grid"
            [data]="entityGrid?.view | async"
            [scrollable]="'virtual'">
 </kendo-grid>
4

2 に答える 2

5

スクロール (および静的ヘッダー) を使用する場合、グリッド コンテンツ領域にも高さが必要です。ページに基づいて動的に計算することは現時点ではサポートされておらず、angular-universal では機能しません。これをkendo-angular2 リポジトリに機能リクエストとして記録すると、実装が検討されます。

とはいえ、次のハックを使用して機能させることができます。

encapsulation: ViewEncapsulation.None,
styles: [
  `kendo-grid {
    height: calc(100% - 3em);
    margin-top: 3em;
  }
  kendo-grid .k-grid-content {
    height: calc(100% - 46px);
  }`
],

これにより、コンポーネント自体にスタイルが渡されます。値46pxはヘッダーのサイズであり3em、目的のオフセットです。

実際のデモについては、この plunkr の例を参照してください。

于 2016-11-24T12:51:55.700 に答える