angular-highlight-text

a simple directive to highlight text portions inside a element

It works like the classic Find function.

Below there is a paragraph which uses the directive and every 2 seconds it will search for a different word inside the text.

You can also customize classes to have different highlight styles around your app by using the attribute highlight-class.

Highlighted text let you find faster what you want.

When the search value changes the directive will re-render the element to highlight the portion of the string you are looking for.

You can use it as a directive: highlight-text="{text: 'Some text', match: 'some'}"

<p highlight-text="{text: myText, match: myMatch}"></p>

It's very funny to use with ng-repeat and other filters

When the ng-repeat is filtered the text is also highlighted to let you know what is matching.

You can use it as a filter: highlightText: matchText:highlightClass

ng-bind-html="item | highlightText: matchText:'highlighted-blu'"