Javascript AngularJS：如何排除多个指令？

（1）我有一个名为

portlet

的转置指令，它获取其内容并将其包装在一些样板代码中。例如：

<portlet>
  <div class="foobar">My content</div>
</portlet>

并成为：

<div class="portlet">
  <div class="icon"></div>
  <div class="content">
      <div class="foobar">My content</div> <!--the original content
                                         passed to portlet-->
  </div>

dyn表单

的模板：

<form class="..." ng-transclude="">
</form>

（3）问题出在这里。我想使用第三个指令，

dyn-formportlet

生成样板代码，用于显示每个表单上方显示的一些按钮，然后显示一个portlet，并将

dyn-form

放在portlet内部。这就是我试图做到的：

<dyn-form-portlet>
   <dyn-form>
     <dyn-form-field />
   </dyn-form>
</dyn-form-portlet>

理论上，这应该是可行的，即

应该放在

里面，

里面的

等等。但是当我运行这个程序时，我只看到由

dyn form portlet

显示的按钮和

portlet

的代码，但是

portlet

是空的，表单没有显示在其中

---

我是做错了什么，还是这是一个bug？

我已经设法解决了这个问题。我在

portlet

指令中使用了

transclude:'element'

以及

replace:true

，并且我给它的

优先级高于其他指令。我之所以这样做，是因为我对anuglar的内部运作有着深刻的了解，而不是感觉

关于第一部分
transclude:'element'
之所以使用，是因为

“元素”-排除整个元素，包括以较低优先级定义的任何指令

之所以使用Replace，是因为从我所看到的情况来看，当transclude设置为element时，总是使用Replace。
优先权是我的直觉

这是plnkr

这可能不是你想要的答案，但我需要深入研究角度指令，才能真正理解发生了什么。不管怎么说，这不是一个bug，只是糟糕的文档。
如果有人感兴趣，就会大发雷霆：如果你从portlet中删除transclude:true，它会起作用，但我不确定其含义。下面是我相信会发生的事情。
dyn form portlet
模板中的
指令在链接该指令之前由Angular编译，因此当处理
dyn form portlet
时，其模板中的
portlet
标记已经呈现。看看这个，并查看控制台输出。不知道这是一个bug，还是在这种情况下只是一个有角度的自然行为。@MichaelBenford这确实是正在发生的事情，但它看起来像一个bug。我的意思是，
dyn表单
中的所有子指令都被转换成
dyn表单
，那么为什么
dyn表单portlet
和
dyn表单
会有所不同呢？有人能将此作为bug报告给AngularJS团队吗？完成：@JesusRodriguez谢谢
<form class="..." ng-transclude="">
</form>

<form class="...">
  <label>Name: <input type="text" placeholder="..." /></label>
  <!- ....and so on... -->
 </form>

<dyn-form-portlet>
   <dyn-form>
     <dyn-form-field />
   </dyn-form>
</dyn-form-portlet>

<div class="dyn-form-portlet">
  <button>Foo</button>
  <button>Bar</button>
  <portlet ng-transclude="">
  </portlet>
</div>