升级到 angular 7,rxjs6 时,如何解决“ 属性 'wheelDelta' 在类型 'WheelEvent' 上不存在”?

How to fix " Property 'wheelDelta' does not exist on type 'WheelEvent' " while upgrading to angular 7,rxjs6?

我正在使用 rxjs6 升级到 angular7:在 mouseWheelEvent 类型中我得到 "Property 'wheelDelta' does not exist on type 'WheelEvent'"

wheelDelta我们有其他选择吗?

mouseWheelFunc(event: MouseWheelEvent): void {

    //  var event = window.event || event; // old IE support

    let delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail)));

    if ( delta > 0) {
      this.mouseWheelUp.emit(event);
    } else if ( delta < 0) {
      this.mouseWheelDown.emit(event);
    }

    // for IE
    event.returnValue = false;
    // for Chrome and Firefox
    if ( event.preventDefault) {
      event.preventDefault();
    }
  }

ERROR in src/modules/components/numeric-stepper/mousewheel.directive.ts(23,49): error TS2339: Property 'wheelDelta' does not exist on type 'WheelEvent'.

WheelEvent 似乎不再像它所说的那样 属性。现在他们添加了 deltaY 和 deltaX。

现在您必须访问 event.deltaY 而不是 event.wheelData

但是deltaY的值与wheelData相反。这意味着当事件上的 wheelData 为正数(向上滚动)时,deltaY 将为负数,反之亦然。

示例:

改变这个:

        zoomScroll(event: WheelEvent) {
            if (event.wheelDelta > 0) {
                this.zoomIn();
            } else if (event.wheelDelta < 0) {
                this.zoomOut();
            }
        }

为此:

       zoomScroll(event: WheelEvent) {
           if (event.deltaY < 0) {
               this.zoomIn();
           } else if (event.deltaY > 0) {
               this.zoomOut();
           }
    }

来源:https://github.com/Microsoft/TypeScript/issues/9071