javascript - Kendo UI Angular Grid - 只需要显示一行内容

Question

我正在为 Angular 使用 Kendo UI 网格，并且有一个网格列之一有大量文本数据的场景，但我不希望文本换行。我希望所有行的高度都相同。

我尝试将它添加到我的组件的 SCSS 文件中:

.k-grid {
  background-color: green;
 }
 
 .k-grid tbody tr {
  height: 40px;
 }
 
 .k-grid tbody tr td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

背景是绿色的(我把它放在那里是为了排除我的 SCSS 没有正确构建的任何问题)但是其他样式似乎被忽略了。我查看了 Chrome 调试器中的元素，根本没有引用行内容的规则，这让我认为这些选择器不适用于 Angular 版本。有很多关于 jQuery 版本的文档(这是我从那里得到的)但没有关于 Angular 控件的文档。

有没有人知道我做错了什么或有任何想法如何使这项工作？

谢谢，詹姆斯

Answer 1

试试这个:

/deep/ .k-grid tbody tr {
    height: 40px;
}

/deep/ .k-grid tbody tr td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
 }

编辑:
有关详细信息，您可以在文档中阅读 here .