如何在angular 4中激发Jquery Datatable子控件事件

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.11.3/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>

import { Component, AfterViewInit, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'app-your-component',
  templateUrl: './your-component.component.html',
  styleUrls: ['./your-component.component.css']
})
export class YourComponent implements AfterViewInit {
  @ViewChild('dataTable', { static: false }) dataTable: ElementRef;

  ngAfterViewInit() {
    $(this.dataTable.nativeElement).DataTable();
  }
}

<table #dataTable>
  <!-- DataTable content here -->
</table>

import { Component, AfterViewInit, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'app-your-component',
  templateUrl: './your-component.component.html',
  styleUrls: ['./your-component.component.css']
})
export class YourComponent implements AfterViewInit {
  @ViewChild('dataTable', { static: false }) dataTable: ElementRef;

  ngAfterViewInit() {
    const table = $(this.dataTable.nativeElement).DataTable();

    $(this.dataTable.nativeElement).on('click', 'tr', function () {
      // 子控件事件处理逻辑
      const rowData = table.row(this).data();
      console.log('Clicked row data:', rowData);
    });
  }
}