AngularJS: Как реализовать директиву, которая выводит свой HTML?

Question

Я хотел бы создать директиву example, которая добавляет свой внутренний HTML к себе. Итак, это:

<div example> 
    <label for="name">Name:</label> 
    <input id="name" type="text" ng-model="name"> 
</div> 

должен стать этим:

Когда внутри директивы, элемент уже есть вещи, выравнивают class="ng-scope ng-pristine ng-valid", которые не должны быть в выводимого HTML.

Как реализовать такую ​​директиву?

Моя попытка here

Answer 1

Вы, наверное, не нужно transclude или использовать сферу здесь, просто используйте функцию compile, чтобы захватить внутренний HTML и добавить его к узлу:

.directive('example', function() { 
    return { 
    compile: function(ele) { 
     var innerHtml = ele.html(); 
     ele.append(document.createTextNode(innerHtml)); 
    } 
    }; 
}); 

Demo