Angular 如何在不使用复选框的情况下设置角度材质数据表上的默认行选择

我不熟悉棱角材料和棱角材料。如果这个问题问得很琐碎，请道歉

我一直在开发一个应用程序，它有一个带有角度材质数据表的组件

该表包含从服务获取的信息

我的要求是通过在“角度材质”表中使用颜色高亮显示来预选其中一条记录（数据表中的第一条记录），并以与同一组件中的表相邻的形式呈现该行中的信息

如果用户选择了角度材质数据表中的任何其他行，则表单应在表单中重新加载新选择的记录信息

我见过一些带有复选框的示例，但我不打算对表中的记录进行任何多选操作

下面的屏幕截图显示了我的需求示例

---

只需在.ts中添加一个变量，例如

selectedIndex

。然后在定义垫子行的部分，可以使用类似的

<tr mat-row *matRowDef="let row; columns: displayedColumns;let i = index"
     [style.background]="i==selectedIndex?'red':'inherit'"
     (click)="selectedIndex=i">
</tr>

在本例中，我仅更改[style.background]，您可以使用

[ngClass]=“{'yourClass'：I==selectedIndex}”

并在.css中定义该类

首先，使selectedIndex等于0

---

参见

中的示例您确定数据表是实现此目的的最佳方法吗？真的有必要吗？你是否考虑使用列表来代替？我之所以考虑数据表，是因为在这种情况下，呈现的记录数可能有数百甚至数千条。由于Material table附带分页功能，我认为最好使用数据表来满足此要求。此外，table将支持排序，这可能是使用tableHi Eliseo的另一个考虑因素，我看到您已经设置了ngClass。但是，如果必须捕获第一行来加载表单，我该怎么做？我需要从selectedIndex所指向的记录中捕获数据以加载表单&默认情况下，在每次用户更改选择时，在组件加载和重新加载表中的第一行都会发生这种情况。