Showing posts with label $sce service. Show all posts
Showing posts with label $sce service. Show all posts

Wednesday, July 8, 2015

$sce service in AngularJS

sce stands for Strict Contextual Escaping, and is used in places where we need to explicitly need to mark certain content as safe and display them in the view. One common example is parsing and rendering HTML content in the view.

The ng-bind-html directive is used in places where we need to parse HTML content and render the output instead of just displaying the HTML tags in the view, by default any value bound to this directive will be passed through $sanitize to validate and clean so that no unsafe inputs are rendered to the view, this validation process might filter out some of the HTML tags from the source which are deemed to be un-safe. The $sce can be used to skip the validation process and render the content as it is in the view. $sce.trustAsHtml instructs Angular that the content is valid and can skip the validation done by $sanitize, this makes sure that the full HTML is parsed and rendered as output in the View.

The following example uses $sce.trustAsHtml to display HTML content to the view using ng-bind-html directive.