Skip to content

Instantly share code, notes, and snippets.

@nelsonpecora

nelsonpecora/trusthtml.js

Created May 22, 2014 17:03
Show Gist options
  • Save nelsonpecora/2c494780f01c96bab2e4 to your computer and use it in GitHub Desktop.
Save nelsonpecora/2c494780f01c96bab2e4 to your computer and use it in GitHub Desktop.
Download ZIP
Custom filter to trust all html. WARNING: Use with caution. Don't use when displaying user-created content.
Raw
trusthtml.js
app.filter('trusthtml', ['$sce', function ($sce) {
return function(t) {
return $sce.trustAsHtml(t)
}
}]);
@antoinebqain
Copy link

Unknown provider: trusthtmlFilterProvider <- trusthtmlFilter

the code is :

<div id='content' ng-app='test1' ng-controller='test1Ctrl'>
        <div ng-repeat="d in data" ng-bind-html="d.ss_body | trusthtml">
            {{ d.label }}
            <img src="{{d.ss_field_image}}">
            <p>{{d.ss_body}}</p>
        </div>
    </div>
.
.
.
app.filter('trusthtml', ['$sce', function ($sce) {
            return function(t) {
                return $sce.trustAsHtml(t)
            }
        }]);

@antoinebqain
Copy link

All HTML :

 <html>
<head>
    <title>test 1</title>
    <link rel="stylesheet" type="text/css" href="css/animations.css">
    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-animate/angular-animate.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="bower_components/angular-resource/angular-resource.js"></script>
    <script src="bower_components/angular-websql/angular-websql.min.js"></script>
</head>
<body>
    <h1>hello!</h1>
    <div id='content' ng-app='test1' ng-controller='test1Ctrl'>
        <div ng-repeat="d in data" ng-bind-html="d.ss_body | trusthtml">
            {{ d.label }}
            <img src="{{d.ss_field_image}}">
            <p>{{d.ss_body}}</p>
        </div>
    </div>

    <script type="text/javascript">
        var app = angular.module('test1', []);
        app.controller("test1Ctrl", function($scope, $http){

            $http.get('http://192.168.2.12:9001/articles').success(function(data) {
                $scope.data = data;
            });
        $scope.understand = "I now understand how the scope works!";

        app.filter('trusthtml', ['$sce', function ($sce) {
            return function(t) {
                return $sce.trustAsHtml(t)
            }
        }]);
    });
    </script>
</body>
</html>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment