2013-11-22 36 views
0

我们最近升级到了Angular 1.2.1,并且遇到了ng-include的一些问题。升级到Angular 1.2.1后的范围层次结构问题

这里有一个简单的例子,显示我们的角度1.1.1用法:
http://jsfiddle.net/Dq57j/1/

这里与角1.2.1其他摆弄的解决方法,我们的问题:
http://jsfiddle.net/78FJJ/4/

- HTML剪断below--

<div ng-controller="RootCtrl" id="a"> 
     Hello, {{name}}! 

     <!-- does not work in Angular 1.2.1 --> 
     <!--div ng-controller="TemplateCtrl" id="b" 
      ng-include src="'template.html'"> 
     </div--> 

     <!-- workaround --> 
     <div ng-controller="TemplateCtrl" id="b"> 
      <div ng-include src="'template.html'"> 
      </div> 
    </div> 

如果注释掉日解决方法并运行原始代码,此示例将无法按预期工作,即输出“模板说:”。看起来好像该模板无法读取由TemplateCtrl初始化的范围。

如果进一步调查该问题的jsfiddle之外并密切观察所产生的范围(例如,使用Batarang),你会看到,会产生以下的范围层次结构(其中范围的名称反映了相应的div的id):

一个
| _ç
        | _ b

对我来说,这似乎是很奇怪的。角怎么扭曲范围层次根据我应该是a-> b-> c?请注意,此示例在v.1.1.1中的工作原因是,该版本的Angular中的层次结构为a-> b-> c

任何人都可以解释这一点,究竟是在两个版本之间发生了什么变化?

回答

0

版本1.2.0-rc3中发生了一次突破性变化,影响了跨界工作的方式,并且在同一元素上跨越/隔离范围可以进行通信。

所以是的,现在ng-controller和ng-include(它是transclude:element)在同一个元素上将不再共享范围。这是预期的行为。

“为什么”说明会过于复杂,但是,是的,这是它现在的工作原理。您的“解决方法”是您现在要做的正确方法。

编辑:这不是1.2.0-RC3,这是最终的1.2.0:从更新日志:

由于909cabd3,无需分离范围指令不从分离指令得到分离范围在相同的元素。如果代码依赖于此行为(非隔离指令需要从隔离范围内访问状态),请更改isolate指令以使用作用域本地来显式传递它们。