事件绑定角度2

发布时间：2020-12-17 17:10:01 所属栏目：安全来源：网络整理

导读：我想用这个“tmp”来绑定事件,但是这也附加了以前的现有按钮,为什么？ constructor(private renderer :Renderer,private element : ElementRef){ } private appender(){ var tmp = this.renderer.createElement(this.element.nativeElement,'button'); this.

我想用这个“tmp”来绑定事件,但是这也附加了以前的现有按钮,为什么？

constructor(private renderer :Renderer,private element : ElementRef){
        }
    private appender(){
        var tmp  = this.renderer.createElement(this.element.nativeElement,'button');
        this.renderer.listen(tmp,'click',( event:Event ) => console.log(event));
    }

解决方法

这可以使用Renderer2实现,如下所示,

将Renderer2服务注入组件

constructor(private renderer: Renderer2){}

使用listen方法注册事件监听器

this.renderer.listen('body',this.calback)

触发事件时将执行回调功能.

calback(event){
  console.log(event)
}

注意：listen refer docs的方法定义以获取更多信息

listen(target: 'window'|'document'|'body'|any,eventName: string,callback: (event: any)

LIVE DEMO

（编辑：李大同）

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