Angular Html Highlighter
Highlight strings of text across the entire page, regardless of application, library or component boundaries.
Usage
- Install the library in your
package.json for example using npm i --save ngx-html-highlighter.
- Add the
NgxHtmlHighlighterModule.forRoot() to your module's imports section. The forRoot is necessary for the service to be available (see next item).
- Inject the
HighlighterService in your module or component.
- Call
createHighlighter with an optional options argument to create a highlighter object. The highlighter begins its work immediately.
- Important: When no longer needed call
destroy on the highlighter object or alteratively pass the highlighter to the service's destroyHighlighter method.
Options
export interface Options {
tagAttribute: string;
highlightClass: string;
}
tagAttribute is the attribute name used to "tag" a node as having been inserted by the highlighter.
highlightClass is the class added to the highlighted spans. You should add styles to this class in your global stylesheets (e.g. src/app/styles.css in a default angular app)