对于 Angular js ui 网格删除右侧和底部滚动边界

Question

在 Angular js ui rid 中，如何删除垂直和水平滚动条？

而且对于每个列标题，默认情况下我都会得到一个小胡萝卜图标，它显示排序上升、排序下降、隐藏列。我也想从我的列标题中删除它。

而不是 ui 网格默认出现的 .table-striped，我想使用 .table-bordered。有什么地方可以设置这些参数到ui grid?

Answer 1

    enableHorizontalScrollbar : 0,
    enableVerticalScrollbar : 0,
    enableSorting : false,
    enableColumnMenus : false;

Answer 2

@Asqan 很好地回答了你问题的第一部分。对于第二部分：

而不是 .table-striped，它默认用于 ui 网格，我想使用 .table-bordered。有什么地方可以设置这些参数为ui grid?

我想你的意思是你想要我创建的 this plunker 中的外观。

您可以通过两种通用方法之一解决这些 css 问题。

1) 自定义 ui-网格 css

2) 保留原来的 ui-grid css 然后在你自己的 css 文件中覆盖它

我已经展示了解决您的 "stripped" 问题的第一个选项和实现所需边框的第二个选项。 我都做了两个例子，所以你可以看到两个选项 - 我建议选择并始终如一地使用一种方法。

ui-网格设置您在 css 中引用的“.table-条纹”外观。您可以在自己的 css 文件中或使用 customizer tool 并将 @rowcoloreven 和 @rowcolorodd 字段设置为白色 #ffffff 的十六进制代码来覆盖它。这将更新 ui-grid css 以包含以下内容：

.ui-grid-row:nth-child(odd) .ui-grid-cell {
  background-color: #ffffff;
}
.ui-grid-row:nth-child(even) .ui-grid-cell {
  background-color: #ffffff;
}

对于“.table-bordered”，请在 style.css 文件中具体查看这些添加的行

.ui-grid-cell {
    border-style: solid;
    border-bottom: 1px #ff0000;
}

对于 Angular js ui 网格删除右侧和底部滚动边界

For Angular js ui grid remove right and bottom scrolling boarders

angularjs

angular-ui

angular-ui-bootstrap

angular-ui-grid