在表格行上添加边框半径

Question

我正在使用数据网格来显示一些信息。

我想将边框半径添加到表中的所有行中，但是我没有得到它。

有人知道如何向表格中的所有行添加边框半径吗？

有没有一种方法可以使文本完全向左对齐并“删除”那里的列，但又不删除索引？

谢谢

DEMO

代码

<dx-data-grid class="tableTask" id="gridContainer" [dataSource]="Data" [remoteOperations]="false"
    [allowColumnReordering]="true" [showRowLines]="false" [showColumnLines]="false" [rowAlternationEnabled]="true"
    [showBorders]="false">   
    <dxo-group-panel [visible]="true"></dxo-group-panel>
    <dxo-grouping [autoExpandAll]="false"></dxo-grouping>
    <dxi-column dataField="name" [groupIndex]="0"></dxi-column>
    <dxi-column dataField="name" dataType="string"></dxi-column>
    <dxi-column dataField="name1" dataType="string"></dxi-column>
    <dxi-column dataField="name2" dataType="string"></dxi-column>
    <dxi-column dataField="name3" dataType="string" [width]="150"></dxi-column>
</dx-data-grid>

Answer 1

您需要将border-radius直接添加到表单元格（第一个和最后一个孩子）：

 ::ng-deep .tableTask .dx-datagrid-rowsview .dx-data-row td:first-child {
   border-bottom-left-radius: 8px;
   border-top-left-radius: 8px;
 }

  ::ng-deep .tableTask .dx-datagrid-rowsview .dx-data-row td:last-child {
   border-bottom-right-radius: 8px;
   border-top-right-radius: 8px;
 }