Directive exportAs

参考文档:https://angular.cn/api/core/Directive

什么是exportAs?
exportAs,是定义在directive中的定义一个名字,用于在模板中把该指令赋值给一个变量。改变量可以调用directive里面的方法

例如有以下指令

@Directive({
  selector: '[appFjAutocomplete]',
  exportAs:'app-fj'
})
export class FjAutocompleteDirective {
  el:ElementRef
  defaultText:String = 'default';
  constructor(el: ElementRef) {
     this.el = el; // 获取当前的dom
  }
  autoData(){
    return 'getdatas'
  }
}

 使用:在input上新建一个变量applyNameAuto,并且将applyNameAuto赋值为这个指令(即app-fj),
好处:我们可以通过ref调用directive函数或访问directive props(即FjAutocompleteDirective里面的方法 )。

<input type="text" [appFjAutocomplete]="'auto'" #applyNameAuto="app-fj">

// <app-autocomplete [Dom]="applyNameAuto"></app-autocomplete>

 打印applyNameAuto会看到FjAutocompleteDirective中的方法和属性;

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值