Questions tagged [ng-bind-html]

ngBindHtml creates a binding that will innerHTML the result of evaluating the expression into the current element in a secure way.

ngBindHtml creates a binding that will innerHTML the result of evaluating the expression into the current element in a secure way. By default, the innerHTML-ed content will be sanitized using the $sanitize service. To utilize this functionality, ensure that $sanitize is available, for example, by including ngSanitize in your module's dependencies (not in core Angular). In order to use ngSanitize in your module's dependencies, you need to include "angular-sanitize.js" in your application.

You may also bypass sanitization for values you know are safe. To do so, bind to an explicitly trusted value via $sce.trustAsHtml. See the example under Strict Contextual Escaping (SCE).

Note: If a $sanitize service is unavailable and the bound value isn't explicitly trusted, you will have an exception (instead of an exploit.)

Usage
as attribute:

<ANY
  ng-bind-html="">
...
</ANY>

Example

<div ng-controller="ExampleController">
 <p ng-bind-html="myHTML"></p>
</div>

Resources

242 questions
6
votes
2 answers

ng-bind-html vs {{interpolation}}

That is my question, what are the pros and cons ? In my app I am using interpolation but I get errors like this {{::sport.name}} -> NHL Futures & Props and if I use ng-bind-html ng-bind-html="sport.name" -> NHL Futures & Props in this case…
Non
  • 8,409
  • 20
  • 71
  • 123
6
votes
1 answer

Angular: ng-click on ng-bind-html block not firing

I am quite new in the area of AngularJS and of course I am doing something in the wrong way. So, here is my problem: I have a small chat widget which takes the data through JSON from a PHP API. In my JSON I provide all the messages with wrappers and…
Comforse
  • 2,027
  • 4
  • 25
  • 40
6
votes
4 answers

how to limit character number in ng-bind-html in AngularJS?

How can I limit number of characters for ng-bind-html result in angularJS? Is it possible? For example there is some text in js file and with $sce and ng-bind-html transform to html. I want to show som... How can I limit it?
m hadadi
  • 949
  • 2
  • 10
  • 22
6
votes
3 answers

ng-bind-html doesn't work for ng-options

I need to sanitize special characters in options, but it doesn't work correctly. Maybe anybody can tell me how i should do it correctly? For example: HTML:
Following does: I guess ng-bind-html is unable to bind to a input element? Also does ng-bind-html actually…
Vikas Singhal
  • 811
  • 1
  • 9
  • 17
5
votes
3 answers

Angular JS: Detect if ng-bind-html finished loading then highlight code syntax

I am using ng-bind-html for binding data that I get from database.

app.controller('customersCtrl', function($scope, $http, $stateParams) { console.log($stateParams.id); $http.get("api…
Linh
  • 57,942
  • 23
  • 262
  • 279
5
votes
3 answers

how to force angular to re-bind/update even there is no change in the model

Ok -- so you might be thinking why would you want this but I am trying to render some HTML using ng-html-bind like so (in HAML): #my-visualization-panel{'ng-bind-html' => 'htmlSource'} the htmlSource has some html which renders a visualization…
hiroprotagonist
  • 902
  • 1
  • 11
  • 24
4
votes
1 answer

ng-bind-html and angular.js error

I´m playing with angular.js and try to learn ng-bind and ng-bind-html. First, my code:
Peter
  • 2,004
  • 2
  • 24
  • 57
4
votes
4 answers

ng-click not working inside the controller using of ng-bind-html

below my code ng-click not working,while i am checking the inspect element ng-click not showing, help me how to do var app = angular.module('myApp', ['ngSanitize']); app.controller('myCtrl', function($scope) { $scope.firstName = "
user4277191
4
votes
1 answer

how can i use ng-click in ng-bind-html

I am using ng-bind-html in my controller like $scope.message=' You currently have no ORDERS Back13'; and in html page Warning! But the Back() is not…
Shekkar
  • 244
  • 3
  • 10
  • 21
4
votes
5 answers

ng-bind-html doesn't work properly

I want to show my data as html in angularjs. Here is apart of my codes :
cagin
  • 5,772
  • 14
  • 74
  • 130
4
votes
1 answer

angularjs binding nbsp entity doesnt work in IE

I'm using ng-bind-html in a table cell and I want the cell not to collapse when the binded value is an empty string (''). So I bind to: value || ' ' This works well on Crome and FF but fails on IE. If I check the source code on IE, it appears…
The Kline
  • 43
  • 3
3
votes
3 answers

$sce.trustAsHtml filter is not getting applied with ng-bind-html on dynamic data

I'm trying to display the html content which I receive in my div.testData by using ng-bind-html together with filter. I've already included 'ngSanitize' in my app. But somehow, it works only partially. Seem like, filter is not getting applied. It…
Sunny
  • 902
  • 3
  • 18
  • 41
3
votes
1 answer

Show icon on ng-bind-html when value is false

I need to show a fontawesome icon within the ng-bind-html on the ui-select, based on a boolean value of course this…
3
votes
0 answers

CSS not running until the page is refreshed manually

The following code bind the sanitized html to a div
The css classes inside the html content did not takes effect after displayed until I manually refresh the page. Did I miss out…
user3227412
  • 187
  • 1
  • 2
  • 16
1
2
3
16 17