嵌套＆QUOT; E＆QUOT;指令 - 多重指令[...]寻求新的/隔离的范围 [英] Nested "E" directives - Multiple directives [...] asking for new/isolated scope
问题描述
问题筑巢隔离范围的指令。
Problem nesting isolated scope directives.
您好，我想窝两个E隔离范围的指令，像这个小提琴。
（要真正重现该问题，您需要取消注释的＆lt;＆LW GT;指令）
Hi, I want to nest two "E" isolated scoped directives, like in this fiddle. (To actually reproduce the problem, you need to uncomment the <lw> directive)
我不断收到这个错误，我不明白/知道如何解决：
I keep getting this error that I don't understand/know how to fix:
Error: [$compile:multidir] Multiple directives [lw, listie] asking for new/isolated scope on: <listie items="items items">
这难道不工作？
谢谢！
Wasn't this supposed to work? Thanks!
推荐答案
删除替换：真正的的指令通过名字'LW'..
remove replace: true on the directive by name 'lw' ..
这也应该解决。
更新小提琴：更新小提琴
app.directive('lw', function(){
return {
restrict: 'E',
scope: {
items: "="
},
template: '<listie items="items"></listie>',
controller: function($scope) {
}
}
});
分析：
是什么原因造成的问题？
替换为=真为LW指令发生的事情是LW具有隔离范围，现为replace = true，这本身就具有隔离范围替换元素是试图在那里更换，所以你在不知不觉中所做的是你想给两个作用域为同一元素listie。
with replace=true for the lw directive what happens is lw has isolate scope, now as replace=true , the replaced element which itself has isolate scope was tried to be replaced there, so what you unknowingly did is you tried to give two scopes for the same element listie.
在 code级观察angular.js 1.2.1版：
行5728：功能applyDirectivesToNode是执行汇编指令，并在这里行5772他们这样做检查，如果我们试图重复分配范围，或者换句话说同一元素有两个示波器功能
line 5728 : function applyDirectivesToNode is the function that executes compile on directive and here in line 5772 they do this checking if we are trying to assign duplicate scope or in other words same element with two scopes .
function assertNoDuplicate(what, previousDirective, directive, element) {
if (previousDirective) {
throw $compileMinErr('multidir', 'Multiple directives [{0}, {1}] asking for {2} on: {3}',
previousDirective.name, directive.name, what, startingTag(element));
}
}
以上是做了检查功能，如果万一有分配两个范围，以相同的元素它扔了错误的尝试。
因此，这是它是如何设计为，而不是一个错误。
above is the function which does that check and if in case there is an attempt to assign two scopes to same element it flings that error . So this is how it is designed to be and not a bug .
为什么取代：真正去除解决问题
通过删除将：符合事实发生的事情反而取代，而不是lw新指令listie的，它得到了追加到它，所以它是一种分离scope嵌套到其他，这是绝对正确和允许的。
嵌套的分离范围是像
by removing replace:true what happened is instead of new directive listie replaced instead of lw , it got appended into it , so it is one isolated scope nested into other, which is absolutely correct and allowed . the nested isolate scope is like
<lw items="items" class="ng-isolate-scope">
<div items="items" class="ng-isolate-scope">
..........
</div>
</lw>
为什么在一个div包装也将工作（这是你的解决方案，您认为解决方法）？
要注意的一点是，在div不与单独的分离范围的元件。它是仅有的元素。
这里替换正在安装LW的分离范围要附加到一个div。 （注：由自身的DIV不具有隔离范围内），所以不附加任何分离2范围
以相同的元素股利。
所以没有重复这样的断言一步过去了，它开始工作。
The point to be noted is that the div is not an element with a separate isolate scope .It is just an element. here on replace you are attaching the isolate scope of lw to be attached to a div . (NOTE : The div by itself does not have an isolate scope ), so there is no 2 isolate scopes attached to same element div . so there is no duplication so the assert step passed and it started working .
因此，这是它是如何设计工作，它绝对不是一个错误。
So this is how it is designed to work and definitely its not a bug .
这篇关于嵌套＆QUOT; E＆QUOT;指令 - 多重指令[...]寻求新的/隔离的范围的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
