eui-highlight pre- and post-tags

[dmassart]

Hello,

I am pretty new to ElasticUI (and javascript) and I have problems getting my highlight pre- and post- tags rendered as html tags. My code is as follows:

<h2>Results</h2>
<ul>
    <li ng-repeat="doc in indexVM.results.hits.hits">
        <div class="shortName" >{{doc._source.title}}</div>
       <div eui-highlight="ejs.Highlight('description').preTags('<b>').postTags('</b>')" eui-enabled="true">{{doc.highlight.description[0] || doc._source.description | limitTo: 250}} ... </div>
    </li>
 </ul>

When a search is issued, results are displayed with the highlighted terms surrounded by <b></b>

blah blah blah <b>highlighted term</b> blah blah blah ...

instead of

blah blah blah highlighted term blah blah blah ...

What do I do wrong?

[dmassart]

OK, I found a solution:

1. Add <script src="http://code.angularjs.org/1.2.16/angular-sanitize.js"></script> to the html header
2. Add the ngSanitize module to angular: `

   `

3. Finally:

<h2>Results</h2>
<ul>
    <li ng-repeat="doc in indexVM.results.hits.hits">
        <div class="shortName" >{{doc._source.title}}</div>
       <div eui-highlight="ejs.Highlight('description').preTags('<b>').postTags('</b>')" eui-enabled="true" ng-bind-html="doc.highlight.description[0] || doc._source.description | limitTo: 250"/> </div>
    </li>
 </ul>