Kendo UI Angular - 如何换行 Header 列？

Kendo UI Angular - How do I Wrap Header Columns?

https://stackblitz.com/edit/kendo-ui-grid-ph71bj

我没法在 Kendo UI 的指南中寻找一种包装 header 文本的方法。 我见过的唯一方法是将 Angular 组件的 ViewEncapsulation 设置为 None，但我无法在我正在处理的项目中执行此操作，应该有更好的方法来覆盖它CSS 但我想不通。

有没有人知道如何做到这一点？如果有人能弄清楚的话，我已经包含了一些示例数据的 Stackblitz。这将是一个巨大的帮助！

设置 headerStyle 输入 (documentation)，使 white-space 为 pre-wrap:

<kendo-grid-column field="Category.CategoryName" title="Test Category Field" [headerStyle]="{'white-space': 'pre-wrap'}"></kendo-grid-column>

Fiddle: https://stackblitz.com/edit/kendo-ui-grid-yhreaf