feat(theme-shared): remove prime table instance from table sort directive and add abp table instance

#2537

npm/ng-packs/packages/theme-shared/src/lib/directives/table-sort.directive.ts

@@ -1,7 +1,17 @@
-import { Directive, Input, Optional, Self, SimpleChanges, OnChanges } from '@angular/core';
+import { SortOrder, SortPipe } from '@abp/ng.core';
-import { Table } from 'primeng/table';
+import {
+  ChangeDetectorRef,
+  Directive,
+  Host,
+  Input,
+  OnChanges,
+  Optional,
+  Self,
+  SimpleChanges,
+} from '@angular/core';
 import clone from 'just-clone';
-import { SortPipe, SortOrder } from '@abp/ng.core';
+import snq from 'snq';
+import { TableComponent } from '../components/table/table.component';
 
 export interface TableSortOptions {
   key: string;
@@ -15,13 +25,30 @@ export interface TableSortOptions {
 export class TableSortDirective implements OnChanges {
   @Input()
   abpTableSort: TableSortOptions;
+
   @Input()
   value: any[] = [];
-  constructor(@Optional() @Self() private table: Table, private sortPipe: SortPipe) {}
+
+  get table(): TableComponent | any {
+    return (
+      this.abpTable || snq(() => this.cdRef['_view'].component) || snq(() => this.cdRef['context']) // 'context' for ivy
+    );
+  }
+
+  constructor(
+    @Host() @Optional() @Self() private abpTable: TableComponent,
+    private sortPipe: SortPipe,
+    private cdRef: ChangeDetectorRef,
+  ) {}
+
   ngOnChanges({ value, abpTableSort }: SimpleChanges) {
-    if (value || abpTableSort) {
+    if (this.table && (value || abpTableSort)) {
       this.abpTableSort = this.abpTableSort || ({} as TableSortOptions);
-      this.table.value = this.sortPipe.transform(clone(this.value), this.abpTableSort.order, this.abpTableSort.key);
+      this.table.value = this.sortPipe.transform(
+        clone(this.value),
+        this.abpTableSort.order,
+        this.abpTableSort.key,
+      );
     }
   }
 }