AngularJS Services $sce - sanitize and render content and resources in templates

Help us to keep this website almost Ad Free! It takes only 10 seconds of your time:
> Step 1: Go view our video on YouTube: EF Core Bulk Extensions
> Step 2: And Like the video. BONUS: You can also share it!

Example

$sce ("Strict Contextual Escaping") is a built-in angular service that automatically sanitize content and internal sources in templates.

injecting external sources and raw HTML into the template requires manual wrapping of$sce.

In this example we'll create a simple $sce sanitation filter :`.

Demo

.filter('sanitizer', ['$sce', [function($sce) {
     return function(content) {
          return $sce.trustAsResourceUrl(content);
      };
}]);

Usage in template

<div ng-repeat="item in items">
    
    // Sanitize external sources
    <ifrmae ng-src="{{item.youtube_url | sanitizer}}">
    
    // Sanitaize and render HTML 
    <div ng-bind-html="{{item.raw_html_content| sanitizer}}"></div>

</div>


Got any AngularJS Question?