给定container1带有transclude和隔离范围的指令(),当链接该指令时,我具有以下范围:
container1
Scope 004 <-- scope of the body Scope 005 <-- scope of directive container1 Scope 006 <-- scope of the ng-transclude
我期望:
Scope 004 <-- scope of the body Scope 005 <-- scope of the directive Scope 006 <-- scope of the ng-transclude
如果同一指令具有 共享作用域 而不是 隔离作用域 ,则可以得到预期的结果。
这给我带来了一个问题,因为,如果被包含的内容包含另一个component1具有隔离范围的指令(),则会得到:
component1
Scope 004 <-- scope of the body Scope 005 <-- scope of the directive Scope 006 <-- scope of the ng-transclude Scope 007 <-- scope of directive component1
我想使用这样的指令:
<container1> <component1 data="objectExposedInContainer1"/> </container1>
但是,这并不工作,里面component1,$scope.data是undefined因为objectExposedInContainer1不上合适的范围。
$scope.data
undefined
objectExposedInContainer1
我有两个问题:
ng-transclude
这是一个无法使用的示例:http : //plnkr.co/edit/NDmJiRzTF9e5gw8Buht2?p=preview。由于Plunker是使用Anguar构建的,因此很难使用Batarang进行调试。我建议在本地下载代码。注释掉line 10的app.js,使其工作使用共享范围。
line 10
app.js
如果ng-transclude的作用域具有隔离范围,为什么它的作用域不是其指令的作用域的子级?
ng-transclude 设计为允许指令使用任意内容,而隔离范围设计为允许指令封装其数据。
如果ng- transclude没有保留这样的范围,那么您要包含的任何任意内容都需要知道指令的实现细节(即,它需要知道在您创建的隔离范围中可以使用的内容)。
ng- transclude
如果不是错误,那么容器指令如何将数据传递给它的内容,如果不像我尝试的那样设置属性的话。
如果容器指令和包含指令是耦合的(即您同时编写了这两个指令,并且需要它们共同起作用),则它们应该通过共享控制器进行通信。
如果应该使用容器指令将内容注入子级作用域(例如ng-repeat),则不应使用隔离的作用域。
有角度的文档很清楚该行为应该是什么:
“在典型的设置中,小部件会创建一个隔离范围,但是包含的内容不是孩子,而是隔离范围的同级。这使得小部件可以具有私有状态,并且可以将包含项绑定到父级(预先隔离)范围。”