Angular Datatable:如何在悬停时获取列数据的工具提示

<angular-datatable>
  <table>
    <thead>
      <tr>
        <th data-column-id="id">ID</th>
        <th data-column-id="name">Name</th>
        <th data-column-id="age">Age</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>John Doe</td>
        <td>25</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Jane Smith</td>
        <td>30</td>
      </tr>
    </tbody>
  </table>
</angular-datatable>

import { Component, HostListener } from '@angular/core';
import { DatatableAPI } from 'angular-datatable';

@Component({
  selector: 'app-my-datatable',
  templateUrl: './my-datatable.component.html',
  styleUrls: ['./my-datatable.component.css']
})
export class MyDatatableComponent {
  datatableAPI: DatatableAPI;

  constructor() { }

  @HostListener('mouseenter', ['$event'])
  onHover(event: MouseEvent) {
    const columnId = event.target['dataset'].columnId;
    const columnData = this.datatableAPI.getHoverData(columnId);
    // 使用获取到的列数据展示为工具提示
    // 可以使用MatTooltip组件或自定义样式来实现
  }
}