0

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

这个 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 最终被解析为 <div>LEVEL 0</div>

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

4

1 回答 1

0

问题是因为您使用的是replace，并且您的上层模板中没有额外的 DOM，因此嵌套指令结构在编译过程中不知何故丢失了。这似乎是一个错误，但我不是 100% 确定。

但是要解决它很容易。在您的模板 1、2 和 3 中，尝试包装<level:n></level:n>在一个 div 中。例如，template2.html 更改为：

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

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

于 2013-07-17T16:34:46.180 回答