AngularJS ng-bind-html directive
AngularJS instance
Bind innerHTML within <p> to the variable myText:
<!DOCTYPE html><html><head><meta charset="utf-8"><script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script><script src="http://apps.bdimg.com/libs/angular.js/1.5.0-beta.0/angular-sanitize.min.js"></script><body><div ng-app="myApp" ng-controller="myCtrl"><p ng-bind-html="myText"></p></div><script>var app = angular.module("myApp", ['ngSanitize']);app.controller("myCtrl", function($scope) { $scope.myText = "My name is: <h1>John Doe</h1>";});</script><p><b>Note:</b> This instance contains the "angular-sanitize.js" file, which removes dangerous code in HTML. </p></body></html>Running results:
my name is:
John Doe
Note: This instance contains the "angular-sanitize.js" file, which removes dangerous code from HTML.
Definition and usage
The ng-bind-html directive is a safe way to bind content to HTML elements.
When you want AngularJS to write HTML in your application, you need to detect some dangerous code. By introducing the "angular-santize.js" module into your application, the ngSanitize function is used to detect the security of the code. in your application you can do so by running the HTML code through the ngSanitize function.
grammar
<element ng-bind-html="expression"></element>
All HTML elements support this directive.
Parameter value
| value | describe |
|---|---|
| Expression | Specifies the variable or expression to be executed. |
The above is a detailed introduction to the AngularJS ng-bind-html instruction example. Friends who need it can refer to it.