AngularJS忽略多个嵌套指令的“某些”的链接函数

Question

在Angularjs 1.0.7和1.1.5中，如果我尝试使用多个直接嵌套的指令，所有将replace设置为true，则链接函数仅针对底部2级别调用，而对于所有顶级级别，它将被忽略

This plunk - 作为示例 - 为指令levelThree执行以下操作

 - <level:three /> is replaced by <level:two />
 - <level:two /> is replaced by <level:one />
 - <level:one /> is replaced by <level:zero />
 - <level:zero /> is replaced by <div>LEVEL 0</div>

因此levelThree最终被解析为＆lt; div＆gt; LEVEL 0＆lt; / div＆gt;

我这样做的原因是因为我希望在levelZero中有一个非常基本/抽象的组件，它由更高级别的指令定制。唯一的问题是仅为levelZero和levelOne调用链接函数（您可以在控制台输出中看到），而对于levelTwo和levelThree则被忽略。这是某种预期的行为吗？

Answer 1

问题是因为您正在使用replace，并且您的上层模板中没有额外的DOM，因此嵌套的指令结构在编译过程中会以某种方式丢失。这似乎是一个错误，但我不是百分百肯定。

但要解决这个问题很容易。在模板1,2和3中，尝试将<level:n></level:n>包装在div中。例如，template2.html更改为：

<div>
    <level:one></level:one>
    <!-- optional extra stuff goes here. -->
</div>

div包装器似乎没必要;但在实践中，我认为你会在你的模板中有“额外的东西”部分，而角度模板有single root限制，所以你最终会以一个包装为根你模板的元素。