Kendo Angular2 Grid - 根据页面宽度自动调整网格列

时间:2018-02-08 15:37:58

标签: angular kendo-ui-angular2

我试图找出如何让Kendo Angular Grid根据页面宽度自动调整列的大小。以这三列网格为例:

  1. 静态宽度为50px
  2. 的列
  3. 宽度为40%的列
  4. 宽度为60%的列
  5. 当网格水平调整大小时,我希望第二列和第三列调整大小并根据百分比宽度填充剩余的空间。

1 个答案:

答案 0 :(得分:2)

得到了Progress团队的答案。在此处发布解决方案,因为它对其他人有用:

<kendo-grid [data]="gridData" [height]="410" >
    <kendo-grid-column field="ProductName" title="Name" width="300">
    </kendo-grid-column>
    <kendo-grid-column field="Category.CategoryName" title="Category" [headerStyle]="{'width': '80%'}" [style]="{'width': '80%'}">
    </kendo-grid-column>
    <kendo-grid-column field="UnitPrice" title="Price" [headerStyle]="{'width': '20%'}" [style]="{'width': '20%'}">
    </kendo-grid-column>
</kendo-grid>