AngularJS自定义指令隔离作用域

看ng book1里面第十章的隔离作用域,我对里面的例子稍加修改以证明隔离作用域和外部作用域是不能互相访问的。代码如下




  



运行结果是

Outside myDirective:
Outside Property: wow, this is hot
Inside myDirective: wow, this is cool
Outside Property: 

但是当我把angularJS换成高版本的。例如1.2.13,1.5.0却发现这个结果不一样了。

Outside myDirective: wow, this is cool 
Outside Property: wow, this is hot
Inside myDirective: wow, this is cool 
Outside Property: wow, this is hot

难道新版AngularJS不支持隔离作用域了?于是在AngularJS官网上找隔离作用域,看到新版隔离作用域的用法。
隔离作用域主要是创建可复用组件,同时我们还希望外部作用域可以把部分值传递给隔离作用域使用。scope配置项是一个包含绑定作用域属性的对象。例如scope: { customerInfo: '=info'}将customerInfo同外部属性info的值进行绑定。这样才能在隔离作用域使用info值指定的属性值。其他外部的值不能再隔离作用域使用。
例子经过修改,如下




  
  Example - example-example18-production
  
  
  
  


  

输出结果如下

Name: Naomi Address: 1600 Amphitheatre
Name: Address:
Name: Yanfei Qiao Address: No. 518 Xinzhuan Rd.
Name: Address:

你可能感兴趣的:(AngularJS自定义指令隔离作用域)