如何在选中复选框时突出显示表行？Angular 7

在Angular 7中，可以通过使用ngClass指令来实现在选中复选框时突出显示表行。ngClass指令可以动态地为HTML元素添加或删除CSS类。

首先，在组件的HTML模板中，可以使用ngClass指令来动态添加CSS类。假设我们有一个数据数组，包含多个对象，每个对象表示一行表数据，并具有一个布尔类型的属性isSelected，表示该行是否被选中。可以使用ngFor指令遍历数据数组，创建表格行，并为每行的复选框绑定isSelected属性：

<table>
  <tr *ngFor="let item of data">
    <td>
      <input type="checkbox" [(ngModel)]="item.isSelected" (change)="highlightRow(item.isSelected)">
    </td>
    <td [ngClass]="{'selected-row': item.isSelected}">{{ item.name }}</td>
    <td>{{ item.description }}</td>
  </tr>
</table>

在上述代码中，[ngClass]="{'selected-row': item.isSelected}"表示根据item.isSelected的值，如果为true，则添加名为'selected-row'的CSS类，从而突出显示该行。

然后，在组件的CSS文件中，可以定义'selected-row'类，来设置选中行的样式：

.selected-row {
  background-color: yellow;
  font-weight: bold;
}

以上代码将选中行的背景色设置为黄色，并将字体加粗。

此外，为了在复选框选中状态发生改变时触发相应的行突出显示效果，还需要在组件的.ts文件中添加相应的highlightRow方法：

highlightRow(isSelected: boolean) {
  // Do something when checkbox selection changes
}

在highlightRow方法中，可以根据isSelected的值执行相应的逻辑。

推荐的腾讯云相关产品和产品介绍链接地址：

1. 腾讯云主页：https://cloud.tencent.com/
2. 云服务器（CVM）：https://cloud.tencent.com/product/cvm
3. 云数据库MySQL版：https://cloud.tencent.com/product/cdb_mysql
4. 人工智能服务（AI）：https://cloud.tencent.com/product/ai_services
5. 云存储（COS）：https://cloud.tencent.com/product/cos
6. 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
7. 云安全中心（SSP）：https://cloud.tencent.com/product/ssp

注意：以上链接仅供参考，实际使用时应根据具体需求和情况选择相应的产品。