Angular 4 - 新的 MouseEvent 导致 IE11 错误
Angular 4 - new MouseEvent causes IE11 error
我在 IE11 的 angular 4 中遇到 mouseEvent 问题。我正在使用 angular 4,angular-cli.
当我激活这行代码时:
let newEvent = new MouseEvent('mouseleave', {bubbles: true});
IE 在控制台中抛出此类异常:
TypeError: Object does not support this operation.
at MenuItemComponent.prototype.onClick (./main.bundle.js:821:13)
at Anonymous function (Function code:37:9)
at handleEvent (./vendor.bundle.js:12039:87)
at callWithDebugContext (./vendor.bundle.js:13247:9)
at debugHandleEvent (./vendor.bundle.js:12835:5)
at dispatchEvent (./vendor.bundle.js:9014:5)
at Anonymous function (./vendor.bundle.js:9604:31)
at Anonymous function (./vendor.bundle.js:19253:9)
at ZoneDelegate.prototype.invokeTask (./polyfills.bundle.js:10732:13)
at onInvokeTask (./vendor.bundle.js:4357:21)
at ZoneDelegate.prototype.invokeTask (./polyfills.bundle.js:10732:13)
at Zone.prototype.runTask (./polyfills.bundle.js:10501:21)
at invoke (./polyfills.bundle.js:10796:21)
我在我的 polyfils.ts 和重建项目中取消了所有注释,我尝试了 IE 和 ES6 填充程序...
我在 Google 中找不到任何类似的东西,我认为这是一个愚蠢的问题 - 云有人请指点我解决方案吗?
您可以通过以下方式欺骗 IE:
从“@angular/core”导入{组件、OnInit、ElementRef、ViewChild};
...
@ViewChild('fileInput') public fileInput: ElementRef;
...
// Trigger button click event
let event;
if (document.createEvent){
// Only for IE and Firefox
event = document.createEvent('MouseEvent');
event.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
} else {
// For Chrome
event = new MouseEvent('click', {bubbles: false});
}
this.button.nativeElement.dispatchEvent(event);
在 html
文件中尝试:
<div #sample>You need to click me</div>
在 component.js 文件中:
@ViewChild('sample') sampleEle: ElementRef;
并像 js
中那样使用点击事件:
this.sampleEle.nativeElement.click();
我在 IE11 的 angular 4 中遇到 mouseEvent 问题。我正在使用 angular 4,angular-cli.
当我激活这行代码时:
let newEvent = new MouseEvent('mouseleave', {bubbles: true});
IE 在控制台中抛出此类异常:
TypeError: Object does not support this operation. at MenuItemComponent.prototype.onClick (./main.bundle.js:821:13) at Anonymous function (Function code:37:9) at handleEvent (./vendor.bundle.js:12039:87) at callWithDebugContext (./vendor.bundle.js:13247:9) at debugHandleEvent (./vendor.bundle.js:12835:5) at dispatchEvent (./vendor.bundle.js:9014:5) at Anonymous function (./vendor.bundle.js:9604:31) at Anonymous function (./vendor.bundle.js:19253:9) at ZoneDelegate.prototype.invokeTask (./polyfills.bundle.js:10732:13) at onInvokeTask (./vendor.bundle.js:4357:21) at ZoneDelegate.prototype.invokeTask (./polyfills.bundle.js:10732:13) at Zone.prototype.runTask (./polyfills.bundle.js:10501:21) at invoke (./polyfills.bundle.js:10796:21)
我在我的 polyfils.ts 和重建项目中取消了所有注释,我尝试了 IE 和 ES6 填充程序...
我在 Google 中找不到任何类似的东西,我认为这是一个愚蠢的问题 - 云有人请指点我解决方案吗?
您可以通过以下方式欺骗 IE:
从“@angular/core”导入{组件、OnInit、ElementRef、ViewChild};
...
@ViewChild('fileInput') public fileInput: ElementRef;
...
// Trigger button click event
let event;
if (document.createEvent){
// Only for IE and Firefox
event = document.createEvent('MouseEvent');
event.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
} else {
// For Chrome
event = new MouseEvent('click', {bubbles: false});
}
this.button.nativeElement.dispatchEvent(event);
在 html
文件中尝试:
<div #sample>You need to click me</div>
在 component.js 文件中:
@ViewChild('sample') sampleEle: ElementRef;
并像 js
中那样使用点击事件:
this.sampleEle.nativeElement.click();