diff --git a/projects/addon-table/components/table/directives/sortable.directive.ts b/projects/addon-table/components/table/directives/sortable.directive.ts
index b413e4164196..e6ef467febe2 100644
--- a/projects/addon-table/components/table/directives/sortable.directive.ts
+++ b/projects/addon-table/components/table/directives/sortable.directive.ts
@@ -1,5 +1,7 @@
-import type {OnInit} from '@angular/core';
-import {Directive, forwardRef, inject} from '@angular/core';
+import type {BooleanInput} from '@angular/cdk/coercion';
+import {coerceBooleanProperty} from '@angular/cdk/coercion';
+import type {OnChanges} from '@angular/core';
+import {Directive, forwardRef, inject, Input} from '@angular/core';
import type {TuiComparator} from '@taiga-ui/addon-table/types';
import {TuiTableTh} from '../th/th.component';
@@ -10,20 +12,32 @@ import {TuiTableDirective} from './table.directive';
standalone: true,
selector: 'th[tuiTh][tuiSortable]',
})
-export class TuiTableSortable>> implements OnInit {
+export class TuiTableSortable>>
+ implements OnChanges
+{
private readonly table = inject(TuiTableDirective);
private readonly th = inject(TuiTableTh);
private readonly sortBy = inject>(forwardRef(() => TuiTableSortBy));
+ @Input({
+ alias: 'tuiSortable',
+ transform: coerceBooleanProperty,
+ })
+ public sortable: BooleanInput;
+
public get key(): keyof T {
return this.th.key;
}
public sorter: TuiComparator = (): number => 0;
- public ngOnInit(): void {
- this.sorter = this.match ? this.table.sorter : this.sorter;
- this.th.sorter = this.sorter;
+ public ngOnChanges(): void {
+ if (this.sortable) {
+ this.sorter = this.match ? this.table.sorter : this.sorter;
+ this.th.sorter = this.sorter;
+ } else {
+ this.th.sorter = null;
+ }
}
public check(): void {
diff --git a/projects/demo/src/modules/components/table/examples/4/index.html b/projects/demo/src/modules/components/table/examples/4/index.html
index c6254112a990..ba826abd9f01 100644
--- a/projects/demo/src/modules/components/table/examples/4/index.html
+++ b/projects/demo/src/modules/components/table/examples/4/index.html
@@ -10,12 +10,21 @@
Find on page
Minimum age
+
+
+