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

您可能不需要在此处转换或使用范围，只需使用compile函数来获取内部html并将其附加到节点：

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

Demo