diff --git a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts index c16f0066eef..262def18abd 100644 --- a/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts +++ b/projects/igniteui-angular/src/lib/directives/text-highlight/text-highlight.directive.ts @@ -152,7 +152,9 @@ export class IgxTextHighlightDirective implements AfterViewInit, OnDestroy, OnCh @Input('page') public page: number; - @Input() + /** + * The content child element that should be hidden when there is a highlight + */ public contentChildElement: ElementRef; /** diff --git a/projects/igniteui-angular/src/lib/grids/cell.component.ts b/projects/igniteui-angular/src/lib/grids/cell.component.ts index b839f523eed..9d17ec74aac 100644 --- a/projects/igniteui-angular/src/lib/grids/cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/cell.component.ts @@ -464,7 +464,7 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { protected inlineEditorTemplate: TemplateRef; @ViewChild(IgxTextHighlightDirective, { read: IgxTextHighlightDirective }) - private highlight: IgxTextHighlightDirective; + protected highlight: IgxTextHighlightDirective; /** * Sets the current edit value while a cell is in edit mode. @@ -619,7 +619,6 @@ export class IgxGridCellComponent implements OnInit, AfterViewInit { this.gridAPI.escape_editMode(this.gridID, editableCell.cellID); } this.cdr.markForCheck(); - this.grid.refreshSearch(); } diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.html b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.html index 2096baf474f..d277fedcde9 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.html +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.html @@ -1,6 +1,5 @@ + [value]="formatter ? formatter(value) : value" [row]="row.rowData" [column]="this.column.field" [containerClass]="'igx-grid__td-text'">
{{ formatter ? formatter(value) : value }}
diff --git a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.ts b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.ts index aa010ff1efb..533a8807d96 100644 --- a/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.ts +++ b/projects/igniteui-angular/src/lib/grids/tree-grid/tree-cell.component.ts @@ -1,4 +1,4 @@ -import { Component, ChangeDetectorRef, ElementRef, ViewChild, Inject } from '@angular/core'; +import { AfterViewInit, Component, ChangeDetectorRef, ElementRef, ViewChild, Inject, ViewChildren, QueryList } from '@angular/core'; import { IgxGridCellComponent } from '../cell.component'; import { IgxTreeGridAPIService } from './tree-grid-api.service'; import { GridBaseAPIService } from '../api.service'; @@ -11,7 +11,7 @@ import { IgxGridBaseComponent } from '../grid'; selector: 'igx-tree-grid-cell', templateUrl: 'tree-cell.component.html' }) -export class IgxTreeGridCellComponent extends IgxGridCellComponent { +export class IgxTreeGridCellComponent extends IgxGridCellComponent implements AfterViewInit { private treeGridAPI: IgxTreeGridAPIService; constructor(gridAPI: GridBaseAPIService, @@ -32,6 +32,36 @@ export class IgxTreeGridCellComponent extends IgxGridCellComponent { @ViewChild('defaultContentElement', { read: ElementRef }) public defaultContentElement: ElementRef; + /** + *@hidden + */ + public ngAfterViewInit() { + if (this.highlight) { + this.highlight.contentChildElement = this.defaultContentElement; + + if (this.grid.lastSearchInfo.searchText) { + this.highlight.highlight(this.grid.lastSearchInfo.searchText, + this.grid.lastSearchInfo.caseSensitive, + this.grid.lastSearchInfo.exactMatch); + this.highlight.activateIfNecessary(); + } + } + } + + /** + * If the provided string matches the text in the cell, the text gets highlighted. + * ```typescript + * this.cell.highlightText('Cell Value', true); + * ``` + * @memberof IgxGridCellComponent + */ + public highlightText(text: string, caseSensitive?: boolean, exactMatch?: boolean): number { + if (this.highlight) { + this.highlight.contentChildElement = this.defaultContentElement; + } + return super.highlightText(text, caseSensitive, exactMatch); + } + /** * @hidden */