title: AngularJS : ng-bind-html inside a uib-tooltip-html
body: <p>I have to show a tooltip in my UI. I am using angularjs in UI side.</p>
  
  <p>Please see the code below.</p>
  
  <pre><code>&lt;i class="fa fa-info-circle f18 darkgray hover pointer" uib-tooltip-html="'&lt;div class=fw-600&gt;Reason:&lt;/div&gt;"+obj.comments+"'" tooltip-class="white-blue-tooltip"&gt;&lt;/i&gt;
  </code></pre>
  
  <p>But I am getting error when the value of <code>obj.comments = Canceled via 'View Group'</code>. Please see the error below.</p>
  
  <pre><code>Error: [$parse:syntax] Syntax Error: Token 'View' is an unexpected token at column 49 of the expression ['&lt;div class=fw-600&gt;Reason:&lt;/div&gt;cancelling via 'View Group''] starting at [View Group''].
  </code></pre>
  
  <p>This is because of the single quote present in the value (Canceled via 'View Group').</p>
  
  <p>In order to solve this I have used <code>ng-Sanitize</code> as described in the following link
  <a href="https://www.w3schools.com/angular/ng_ng-bind-html.asp" rel="nofollow noreferrer">https://www.w3schools.com/angular/ng_ng-bind-html.asp</a></p>
  
  <p>Now my code look like below</p>
  
  <pre><code>&lt;i class="fa fa-info-circle f18 darkgray hover pointer" uib-tooltip-html="'&lt;div class=fw-600&gt;Reason:&lt;/div&gt; ng-bind-html="+obj.comments+"'" tooltip-class="white-blue-tooltip"&gt;&lt;/i&gt;
  </code></pre>
  
  <p>But I am getting output like </p>
  
  <pre><code>Reason: 
  ng-bind-html=Canceled via 'View Group'
  </code></pre>
  
  <p>I have added <code>'ngSanitize'</code> in my controller and loaded the <code>angular.min.js</code> and <code>angular-sanitize.js</code> in the page, is there anything missing here.</p>
  
  <p>Appreciates any help.</p>