加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

链接是什么:功能“参数”(范围,元素,attrs)? AngularJS

发布时间:2020-12-17 10:18:34 所属栏目:安全 来源:网络整理
导读:所以我已经使用AngularJS几个月了,我已经在互联网和我的AngularJS指令书中搜索了这个答案. 在指令中,我几乎总是看到这段代码: link: function(scope,element,attrs) { //body} 函数“scope,attrs”中的项目究竟是什么?这可能是一个愚蠢的问题,但我似乎无法
所以我已经使用AngularJS几个月了,我已经在互联网和我的AngularJS指令书中搜索了这个答案.

在指令中,我几乎总是看到这段代码:

link: function(scope,element,attrs) { 
    //body
}

函数“scope,attrs”中的项目究竟是什么?这可能是一个愚蠢的问题,但我似乎无法在任何地方找到答案.

谢谢!

根据文档 here,为自定义指令定义了参数scope,element和attrs,但您可以将它们重命名为您的类似.

范围:这是自定义指令的范围,类似于控制器中的$scope

element:这是自定义指令的元素

attrs:这是自定义指令中的属性集. (应该是元素的属性,感谢@zeroflagL进行更正!)

例如,如果你构建一个名为myDirective的自定义指令,你可能会在你的html部分中使用它,如下所示:

<my-directive num-rows="3"></my-directive>

这里,num-rows是你的指令的一个属性,你可以在你的链接函数中获取它的值:

function link(scope,attrs) {
    console.log('num-rows:',attrs.numRows);
    //you can change its value,too
    attrs.$set('numRows','10'); //attrs setter

    //you can watch for its changes to trigger some event
    attrs.$observe('numRows',function(newVal) {
       console.log('trigger some event for the changes in numRows here');
    });
}

此外,在上面的链接函数中,您可以将元素/指令绑定到操作:

element.bind('click',function() {
   console.log('do something with the click event');
});

我建议你花些时间阅读文档.链接函数可以采用第4个参数,该参数是自定义指令中所需的另一个指令的控制器.例如.:

require: '^ngModel'
....

function link(scope,attrs,ngModelCtrl) {
  ....
}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读