angular - 如何在 datatables.net 的 table.on() 函数中使用 Angular 注入服务

Question

我在我的 Angular 9 应用程序上使用https://datatables.net/

我的组件上有一个服务，就像这样

constructor(private backOffice: BackofficeService) { }

然后我的 ngAfterViewInit() 上有一个函数，当我单击数据表上的“喜欢”按钮时会触发该函数。

    table.on('click', '.like', function(e) {
      let $tr = $(this).closest('tr');
      console.log ($tr)
    }

我想要做的是在这个函数中调用我的服务，以便在我的后台服务上调用一些方法，以便更改我的数据库中的一些数据。但问题是，在这种情况下，'this'并没有引用我的组件，而是引用了我的表格，所以我不能使用这个.backOffice.myMethod()。

我试图实现的目标是这样的：

    table.on('click', '.like', function(e) {
      const $tr = $(this).closest('tr');
      const data = table.row($tr).data();
      THIS.backOffice.MyMethod(data)
      .subscribe ( response => {
            console.log (response)
      });
    }

我怎样才能做到这一点？

如果这是不可能的，我的问题是如何在我的 component.html 中获取 $tr 引用以使用 (click)="SomeOtherFunction( $tr )" 以便在没有 table.on() 函数的情况下处理此操作?

标签： angulardatatables

Answer 1

你可以尝试如下

const backOffice = this.backOffice;

table.on('click', '.like', function(e) {
      const $tr = $(this).closest('tr');
      const data = table.row($tr).data();
      backOffice.MyMethod(data)
        .subscribe ( response => {
            console.log (response)
        });
    }