Am using Angular material table to display data and using filter function search data. Now i want to highlight searched string only instead of complete row or cell in Angular 4 Material table.
1
votes
1 Answers
0
votes
You can try to highlight the matching results by using HTML tags as <b>result</b> (or even <span class="highlight">result</span> for a more customized style). In order to see HTML content inside cells you must use the [innerHTML]=cellText property binding instead of interpolation {{cellText}}.
An example would be the following:
<mat-cell *matCellDef="let document" [innerHTML]="document.description"></mat-cell>
Where document.description already contains the HTML tags for highlighting.
See https://alligator.io/angular/innerhtml-binding-angular/ for more info
