Lazy loading expensive DOM

lazy-html.js

directive('lazyHtml', function() {
 return {
  transclude: 'element',
  priority: 1200,
  terminal: true,
  restrict: 'A',
  compile: function(element, attr, linker) {
   return function ($scope, $element, $attr) {
    var visible = false;
    var stopWatching = $scope.$watch($attr.lazyHtml, function(value){
      if (value && !visible) {
        visible = true;
        linker($scope, function (clone) {
         $element.after(clone);
        });
        stopWatching();
       }
      });
    }
   }
});