From e5984b14bb6652240fd8151a63d8786588635149 Mon Sep 17 00:00:00 2001 From: Maximilian Koeller Date: Thu, 26 Sep 2024 09:04:53 +0200 Subject: [PATCH] fix: type cell context --- .../lib/components/columns/column-cell.directive.ts | 5 +++++ .../src/lib/components/columns/column.directive.ts | 10 +++++----- .../src/lib/components/datatable.component.ts | 8 ++++---- .../ngx-datatable/src/lib/types/cell-context.type.ts | 4 ++-- .../ngx-datatable/src/lib/types/table-column.type.ts | 6 +++--- projects/ngx-datatable/src/lib/utils/column-helper.ts | 2 +- src/app/basic/row-detail.component.ts | 2 +- 7 files changed, 21 insertions(+), 16 deletions(-) diff --git a/projects/ngx-datatable/src/lib/components/columns/column-cell.directive.ts b/projects/ngx-datatable/src/lib/components/columns/column-cell.directive.ts index d09ea73d1..58084d347 100644 --- a/projects/ngx-datatable/src/lib/components/columns/column-cell.directive.ts +++ b/projects/ngx-datatable/src/lib/components/columns/column-cell.directive.ts @@ -1,6 +1,11 @@ import { Directive, TemplateRef } from '@angular/core'; +import { CellContext } from "../../types/cell-context.type"; @Directive({ selector: '[ngx-datatable-cell-template]' }) export class DataTableColumnCellDirective { constructor(public template: TemplateRef) {} + + static ngTemplateContextGuard(dir: DataTableColumnCellDirective, ctx: any): ctx is CellContext { + return true; + } } diff --git a/projects/ngx-datatable/src/lib/components/columns/column.directive.ts b/projects/ngx-datatable/src/lib/components/columns/column.directive.ts index 3f66fb4d3..8f7399f8d 100644 --- a/projects/ngx-datatable/src/lib/components/columns/column.directive.ts +++ b/projects/ngx-datatable/src/lib/components/columns/column.directive.ts @@ -5,10 +5,10 @@ import { DataTableColumnCellTreeToggle } from './tree.directive'; import { ColumnChangesService } from '../../services/column-changes.service'; import { TableColumnProp } from '../../types/table-column.type'; import { DataTableColumnGhostCellDirective } from './column-ghost-cell.directive'; -import { HeaderCellContext } from '../../types/cell-context.type'; +import { CellContext, HeaderCellContext } from '../../types/cell-context.type'; @Directive({ selector: 'ngx-datatable-column' }) -export class DataTableColumnDirective implements OnChanges { +export class DataTableColumnDirective implements OnChanges { @Input() name: string; @Input() prop: TableColumnProp; @Input() frozenLeft: any; @@ -33,12 +33,12 @@ export class DataTableColumnDirective implements OnChanges { @Input() summaryTemplate: TemplateRef; @Input('cellTemplate') - _cellTemplateInput: TemplateRef; + _cellTemplateInput: TemplateRef>; @ContentChild(DataTableColumnCellDirective, { read: TemplateRef, static: true }) - _cellTemplateQuery: TemplateRef; + _cellTemplateQuery: TemplateRef>; - get cellTemplate(): TemplateRef { + get cellTemplate(): TemplateRef> { return this._cellTemplateInput || this._cellTemplateQuery; } diff --git a/projects/ngx-datatable/src/lib/components/datatable.component.ts b/projects/ngx-datatable/src/lib/components/datatable.component.ts index 67fb5bbfe..32607866a 100644 --- a/projects/ngx-datatable/src/lib/components/datatable.component.ts +++ b/projects/ngx-datatable/src/lib/components/datatable.component.ts @@ -628,7 +628,7 @@ export class DatatableComponent implements OnInit, DoCheck, AfterVie * if described in your markup. */ @ContentChildren(DataTableColumnDirective) - set columnTemplates(val: QueryList) { + set columnTemplates(val: QueryList>) { this._columnTemplates = val; this.translateColumns(val); } @@ -636,7 +636,7 @@ export class DatatableComponent implements OnInit, DoCheck, AfterVie /** * Returns the column templates. */ - get columnTemplates(): QueryList { + get columnTemplates(): QueryList> { return this._columnTemplates; } @@ -711,7 +711,7 @@ export class DatatableComponent implements OnInit, DoCheck, AfterVie _internalRows: TRow[]; _internalColumns: TableColumn[]; _columns: TableColumn[]; - _columnTemplates: QueryList; + _columnTemplates: QueryList>; _subscriptions: Subscription[] = []; _ghostLoadingIndicator = false; protected verticalScrollVisible = false; @@ -812,7 +812,7 @@ export class DatatableComponent implements OnInit, DoCheck, AfterVie /** * Translates the templates to the column objects */ - translateColumns(val: QueryList) { + translateColumns(val: QueryList>) { if (val) { const arr = val.toArray(); if (arr.length) { diff --git a/projects/ngx-datatable/src/lib/types/cell-context.type.ts b/projects/ngx-datatable/src/lib/types/cell-context.type.ts index 339f6f97f..c8b542563 100644 --- a/projects/ngx-datatable/src/lib/types/cell-context.type.ts +++ b/projects/ngx-datatable/src/lib/types/cell-context.type.ts @@ -2,7 +2,7 @@ import { TableColumn } from './table-column.type'; import { SortDirection } from './sort-direction.type'; import { ActivateEvent } from './activate-event.type'; import { TreeStatus } from '../components/body/body-cell.component'; -import { Observable } from 'rxjs'; +import { BehaviorSubject, Observable } from 'rxjs'; import { RowOrGroup } from './group.type'; export interface HeaderCellContext { @@ -30,7 +30,7 @@ export interface CellContext { isSelected: boolean; rowIndex: number; treeStatus: TreeStatus, - disable$: Observable; + disable$: BehaviorSubject; onTreeAction: () => void; expanded?: boolean; } diff --git a/projects/ngx-datatable/src/lib/types/table-column.type.ts b/projects/ngx-datatable/src/lib/types/table-column.type.ts index 412bb7aa6..82170decb 100644 --- a/projects/ngx-datatable/src/lib/types/table-column.type.ts +++ b/projects/ngx-datatable/src/lib/types/table-column.type.ts @@ -1,6 +1,6 @@ import { PipeTransform, TemplateRef } from '@angular/core'; import { ValueGetter } from '../utils/column-prop-getters'; -import { HeaderCellContext } from './cell-context.type'; +import { CellContext, HeaderCellContext } from './cell-context.type'; /** * Column property that indicates how to retrieve this column's @@ -12,7 +12,7 @@ export type TableColumnProp = string | number; /** * Column Type */ -export interface TableColumn { +export interface TableColumn { /** * Internal unique id * @@ -160,7 +160,7 @@ export interface TableColumn { * * @memberOf TableColumn */ - cellTemplate?: any; + cellTemplate?: TemplateRef>; /** * Ghost Cell template ref diff --git a/projects/ngx-datatable/src/lib/utils/column-helper.ts b/projects/ngx-datatable/src/lib/utils/column-helper.ts index fd11cf9a8..f25d03da6 100644 --- a/projects/ngx-datatable/src/lib/utils/column-helper.ts +++ b/projects/ngx-datatable/src/lib/utils/column-helper.ts @@ -82,7 +82,7 @@ export function isNullOrUndefined(value: T | null | undefined): value is null /** * Translates templates definitions to objects */ -export function translateTemplates(templates: DataTableColumnDirective[]): TableColumn[] { +export function translateTemplates(templates: DataTableColumnDirective[]): TableColumn[] { const result: TableColumn[] = []; for (const temp of templates) { const col: TableColumn = {}; diff --git a/src/app/basic/row-detail.component.ts b/src/app/basic/row-detail.component.ts index fa034993e..a0adbc953 100644 --- a/src/app/basic/row-detail.component.ts +++ b/src/app/basic/row-detail.component.ts @@ -69,7 +69,7 @@ import { FullEmployee } from "../data.model"; - {{ expanded === 1 }} + {{ expanded }}