为了账号安全,请及时绑定邮箱和手机立即绑定

&作用域绑定

& 传递参数的方式不太明白 ,tpl里面应该共有的是scope作用域,直接传参不行不可以吗?表示不理解?

正在回答

1 回答

如何使用前缀标识符:

@

这是一个单项绑定的前缀标识符
使用方法:在元素中使用属性,好比这样<div my-directive my-name="{{name}}"></div>,注意,属性的名字要用-将两个单词连接,因为是数据的单项绑定所以要通过使用{{}}来绑定数据。

=

这是一个双向数据绑定前缀标识符
使用方法:在元素中使用属性,好比这样<div my-directive age="age"></div>,注意,数据的双向绑定要通过=前缀标识符实现,所以不可以使用{{}}。

&

这是一个绑定函数方法的前缀标识符
使用方法:在元素中使用属性,好比这样<div my-directive change-my-age="changeAge()"></div>,注意,属性的名字要用-将多个个单词连接。

注意:在新创建指令的作用域对象中,使用属性的名字进行绑定时,要使用驼峰命名标准,比如下面的代码。

全选复制放进笔记

scope: {            // `myName` 就是原来元素中的`my-name`属性
           name: '@myName',
           age: '=',            // `changeMyAge`就是原来元素中的`change-my-age`属性
           changeAge: '&changeMyAge'
       }

进一步说明,我们的指令是如何利用这些前缀标识符来寻找我们想要的属性或者函数的?

@ 当指令编译到模板的name时,就会到scope中寻找是否含有name的键值对,如果存在,就像上面那样,看到@就知道这是一个单向的数据绑定,然后寻找原来的那个使用指令的元素上(或者是指令元素本身)含有这个值的属性即my-name={{name}},然后在父作用域查找{{name}}的值,得到之后传递给模板中的name。

=和&与@差不多,只不过=进行的是双向的数据绑定,不论模板还是父作用域上的属性的值发生改变都会使另一个值发生改变,而&是绑定函数而已。

原文:一招制敌 - 玩转 AngularJS 指令的 Scope (作用域)

1 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
AngularJS实战
  • 参与学习       205465    人
  • 解答问题       1158    个

一起学习AngularJS的基础教程,通过实例学习并学会AngularJS

进入课程

&作用域绑定

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信