将事件对象传递给指令

Question

我想将事件对象传递给指令中的函数

我在question.page.html

中有这个

<ion-content appHideHeader [header]="header" [scrollEvents]="true">

我在 hide-header.directive.ts

中有这个

@Directive({
  selector: '[appHideHeader]'
})
export class HideHeaderDirective {
  @Input() header: HTMLElement;

  constructor() { }

  @HostListener('ionScroll')onContentScroll(e) {
    console.log('scroll');
    console.log(e);
  }

}

当我滚动时，我在控制台中得到了这个

scroll
undefined

我试过了，但没有用（这是有道理的）

<ion-content appHideHeader [header]="header" [scrollEvents]="true" (ionScroll)="onContentScroll($event)">

所以，我想在指令中将 $event 传递给 onContentScroll() 函数。我该怎么做？

Answer 1

HostListener 接受两个参数，第一个是事件名称类型，第二个是值数组。你可以像这样传递 $event

试试这个：

@HostListener('ionScroll', ['$event'])onContentScroll(e) {
    console.log('scroll');
    console.log(e);
  }

将事件对象传递给指令

Pass event object to directive

ionic-framework

angular

ionic4