AngularJS指令保留原始内容

Question

我对transclude / replace和指令感到困惑。我以为我理解但现在我迷失了如何使这个特定的测试用例工作。从我在文档，SO和博客中的所有内容来看，下面的代码似乎都可行。首先，一些代码：

标记：

<my-directive><h1>My Title</h1></my-directive>

我想要的最终结果：

<my-directive><div class="awesome"><h1>My Title</h1></div></my-directive>

指令：

myApp.directive('myDirective', function() {
  return {
    restrict: 'E',
    transclude: true,
    template: '<div class="awesome"></div>'
  }
});

而不是我想要的，我得到：

<my-directive><div class="awesome"></div></my-directive>

我做错了什么？

Answer 1

要将已转换的内容放入div中，请将ng-transclude指令添加到其中...

template: '<div class="awesome" ng-transclude></div>'

Demo - Fiddle

Answer 2

您缺少指令模板中的“ng-transclude”：

<div class="awesome" ng-transculde></div>