angular get-rendered-html directive

from SO answer

by jarnal

HTML

<div ng-app="app" ng-controller="appCtrl">
    <div get-rendered-html>
        <span>{{foo}}</span>
    </div>
</div>

JavaScript

var module = angular.module('app', []);

module.controller('appCtrl', function($scope) {
    $scope.foo = 'FooBar';
});

module.directive('getRenderedHtml', function($timeout) {
    return {
        link: function(scope, element, attrs) {
            var rawHtmlContainer = angular.element('<div></div>');
            $timeout(function() {
                rawHtmlContainer.text(element[0].innerHTML);
                element.append(rawHtmlContainer);
            });
        }
    }
});