剑道角2网格高度

Question

我希望我的网格具有动态高度。之前与角1和剑道我会这样做。

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

用下面的CSS：

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

但随着剑道网格angular2当我尝试这样它不会工作。

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

Answer 1

当使用滚动（和静态标头）时，网格内容区域也需要有一个高度。现在不支持基于页面动态计算它，并且不会使用角度通用。您可以将其记录为kendo-angular2 repo上的功能请求，以便将其视为实施。

这就是说，你可以使用下面的技巧，使其工作：

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

这将通过样式组件本身。值46px是头的大小，并且3em是您想要的偏移量。

请参阅this plunkr example进行工作演示。