angular指令理解之scope

来源:互联网 发布:帝国cms空间模板 编辑:程序博客网 时间:2024/05/17 01:04

在创建指令的时候 有scope这么一个属性   他就是指令的作用域,scope分三种情况


1,在默认情况下,scope被设置为false,这种情况说明指令继承了父controller的scope,可以随意使用父controller中的属性和方法, 这样就会污染父controller,不可取


2,当scope被设置为true的时候, angular会为这个指令创建了一个继承于父controller的scope,在指令的template中可以直接使用{{}}来使用继承于父controller中的属性


3,当scope被设置为{}的时候,angular会为这个指令创建一个完全独立的scope,我们想要去访问和使用父controller时可以使用"=","&","@"



那么  =    @    &  三者有什么不同呢


首先 @   这个是单向绑定的前缀标识符 ,就是说  有这个标识符的属性 会去本身的scope和父controller里去找这个被绑定的属性  ,然后传递给我绑定者,这个调用的时候需要{{}}


=   这是双向绑定的前缀标识符,意思就是  绑定与被绑定双方是互通的,一个改变另一个也会被改变,这个调用的时候是表达式,不需要{{}}


& 这是函数绑定的前缀标识符,是专门用来绑定函数的


注意,其实false,true,{}三者的却别简单的说就是false说与父controller公用一个scope, true是把父controller作用域里的所有属性和方法都复制一份,然后这还是两个不同的scope,只是内容一模一样, {}是个没有复制父controller作用域内属性方法的scope,  而 =  &  @这三个标识符只是声明你要复制什么而已,  @是把父controller中的属性值给复制过来了 (也就是有些教程上说的字符串),= 是把父controller中的属性引用给复制过来了(就好比堆与栈的存储模式一样,这就是为什么=是双向绑定了),而&是把父controller中的函数引用复制过来了,&其实还是在父controller内的,所以他操作的还是父scope中的数据



这个作用域的问题是这样的  ,但是遇见了一个问题就是按道理说 = 标识符应该会改变ng-model中的数据才对  双向绑定嘛   可是 通过指令改变他之后 页面效果是可以呈现的 但是打印的却还是最初没有被改变时的值 , 这个问题用ngModelCtrl.$render可以解决   $render在下一文中记录

原创粉丝点击