在AngularJS动态添加属性指令到指令transclude(Dynamically adding

我试图属性指令动态地添加到transclude指令。

例如，如下模板将开始：

<div class="container">
  <div ng-transclude></div>
</div>

后一个事件发生（例如点击），其将不得不加指令，如一个属性：

<div class="container" some-directive>
  <div ng-transclude></div>
</div>

我使用下面的JavaScript来做到这一点：

div = angular.element("#demoParentDirective .container").clone();
div.attr('some-directive','');
div = $compile(div)($scope);
angular.element("#demoParentDirective .container").replaceWith(div);

然而，这会导致：

Error: [ngTransclude:orphan] Illegal use of ngTransclude directive in the template! No parent directive that requires a transclusion found. Element: <div ng-transclude="">

我已经创建了我想要的Plunker做，以显示我如何做一个精简的演示：

http://plnkr.co/edit/xIKwJqKFbvs6DVnJrDUh?p=preview

任何帮助，将不胜感激。 谢谢。

更新：

按照要求，我创建了一个后续问题询问是否有更好的方法去实现它就是我想要实现：

创建“选项卡，走”属性指令与AngularJS

Answer 1:

添加transclude你的孩子指导修复该问题在你普拉克

angular.module('demo')
.directive('demoChildDirective', function() {
    return {
      restrict: "A",
      priority: 500,
      transclude: true,
      link: function(scope, element, attributes) {
        console.log("Child Directive Applied.");
      }
    }
  });

文章来源: Dynamically adding an attribute Directive to a transclude Directive in AngularJS