如何修复"“WheelEvent"类型不存在属性“wheelDelta"升级到 angular 7,rxjs6 时? [英] How to fix " Property 'wheelDelta' does not exist on type 'WheelEvent' " while upgrading to angular 7,rxjs6?

查看:105
本文介绍了如何修复"“WheelEvent"类型不存在属性“wheelDelta"升级到 angular 7,rxjs6 时?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 rxjs6 升级到 angular7:在 mouseWheelEvent 类型中我得到 属性 'wheelDelta' 在类型 'WheelEvent' 上不存在".

对于 wheelDelta,我们有其他选择吗?

mouseWheelFunc(event: MouseWheelEvent): void {//var event = window.event ||事件;//旧的 IE 支持let delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail)));如果(增量> 0){this.mouseWheelUp.emit(事件);} else if ( delta <0) {this.mouseWheelDown.emit(事件);}//对于 IEevent.returnValue = false;//适用于 Chrome 和 Firefox如果(event.preventDefault){event.preventDefault();}}

<块引用>

错误在src/modules/components/numeric-stepper/mousewheel.directive.ts(23,49):错误 TS2339:类型上不存在属性wheelDelta"'轮事件'.

解决方案

WheelEvent 好像不再有这个属性了.现在他们添加了 deltaY 和 deltaX.

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

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

示例:

改变这个:

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

为此:

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

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

I'm upgrading to angular7 with rxjs6: in mouseWheelEvent type I am getting "Property 'wheelDelta' does not exist on type 'WheelEvent'".

Do we have any alternative for 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'.

解决方案

It seems like WheelEvent doesn't have this property anymore as it says. Now they added deltaY and deltaX.

Now you have to access event.deltaY instead of event.wheelData.

But deltaY has the opposite value of wheelData. That means when wheelData on the event was positive (scroll up) deltaY will be a negative number, and vice versa.

Example:

Change this:

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

For this:

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

source: https://github.com/Microsoft/TypeScript/issues/9071

这篇关于如何修复"“WheelEvent"类型不存在属性“wheelDelta"升级到 angular 7,rxjs6 时?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆