15.指令作用域

指令作用域

{{name}}

image.png

1.scope为bool值

添加input标签 添加ng-model

    
    





{{name}}

a.当为false的时候:

• 子控制器里面没有定义name的时候,使用父控制器的name值,并且当父控制器中的内容改变时,子控制器中的内容也会改变

image.png

• 子控制器里面定义定义name的时候,子级的内容会覆盖父级的内容,但是当修改父级时,子级的内容也会变化

image.png

image.png

b.当指定scope为true

自己就会独立出来一个作用域,子级没有给name赋值时,子级使用值是父级的值,修改父级时子级也会修改

当给子级控制器增加name属性时,子级的值会改变 , 但是父级的值没有改变,即使改变父级的值,子级也不会改变.

image.png

image.png

scope为对象{}

scope值除了是bool之外,还能是一个对象{}

就相当于是一个隔离作用域.如果指令当中用到了属性,会在自己的作用域当中查找,如果有就直接使用,

没有name

• 如果没有.就不显示,它不会到父级当中去查找,并且更改父级中name的值得时候子作用域当中的值不会发生改变

image.png

传入name值

子级的值就在子级显示,不会更改父级的值,当更改父级时子级也不会变化

image.png

指令作用域传递参数

@修饰符

我在外界写了一个content 我想从外界传入一个数据进来,

格式:外界传递参数,使用{{}}来传递

QQ截图20170528110255.png

特点:

• 属于单向的传递,外界修改,内部也会跟着修改
• 内部的修改不会影响外界
• 如果内部当中有该属性,其值会被覆盖掉,使用的值是外界传入的值

QQ截图20170528111148.png

QQ截图20170528111413.png

QQ截图20170528111550.png

QQ截图20170528111925.png

=修饰符

当使用"="传递数据时,不需要{{}} 直接在后面写上要传递的数据即可

特点:

• 属于双向的传递
• 无论那一边进行更改,都会受到影响

QQ截图20170528112747.png

&修饰符

要求外界传递方法进来

QQ截图20170528113657.png