尝试在angular datatables中添加行点击事件，但不起作用

<table datatable [dtOptions]="dtOptions" [dtTrigger]="dtTrigger" class="table table-striped">
  <thead>
    <tr>
      <th>列1</th>
      <th>列2</th>
      <th>列3</th>
      <!-- 其他列 -->
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let item of data">
      <td>{{ item.column1 }}</td>
      <td>{{ item.column2 }}</td>
      <td>{{ item.column3 }}</td>
      <!-- 其他列 -->
    </tr>
  </tbody>
</table>

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Subject } from 'rxjs';
import { DataTablesOptions } from 'angular-datatables';

@Component({
  // 组件配置
})
export class YourComponent implements OnInit, OnDestroy {
  dtOptions: DataTablesOptions = {};
  dtTrigger: Subject<any> = new Subject();

  data: any[] = [
    // 数据源
  ];

  ngOnInit() {
    // 初始化 DataTables 相关选项
    this.dtOptions = {
      pagingType: 'full_numbers',
      // 其他选项
    };
  }

  ngOnDestroy(): void {
    // 销毁订阅
    this.dtTrigger.unsubscribe();
  }
}

import { Component, OnInit, OnDestroy, Renderer2, ElementRef } from '@angular/core';

export class YourComponent implements OnInit, OnDestroy {
  constructor(private renderer: Renderer2, private el: ElementRef) { }

  ngOnInit() {
    // 监听表格行的点击事件
    this.renderer.listen(this.el.nativeElement, 'click', (event) => {
      // 检查是否点击的是表格行
      if (event.target.tagName === 'TR') {
        // 执行相关操作，例如获取当前行的数据
        const rowData = event.target.whateverPropertyYouSetOnEachRow;

        // 进行其他操作，例如导航到另一个页面或显示详细信息
      }
    });
  }
}