Javascript IE 11 浏览器中的错误 - 例外：对象不支持属性或方法“匹配”，其他浏览器工作正常
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46715190/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Error in IE 11 browser - EXCEPTION: Object doesn't support property or method 'matches' , other browser it works fine
提问by stec1
In my case, the webpage works fine in firefox and chrome browser but in IE v.11 it shows error as error comes in IE 11 DEVELOPER TOOLS. The error shows up in developer tools of the IE 11. The error does not allow to open a perticular link , on clicking it shows the following error.
就我而言，该网页在 firefox 和 chrome 浏览器中运行良好，但在 IE v.11 中它显示错误，因为 错误出现在 IE 11 DEVELOPER TOOLS 中。该错误出现在 IE 11 的开发人员工具中。该错误不允许打开特定链接，单击它会显示以下错误。
polyfills.ts -
polyfills.ts -
* BROWSER POLYFILLS
*/
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/set';
/** IE10 and IE11 requires the following for NgClass support on SVG elements */
import 'classlist.js'; // Run `npm install --save classlist.js`.
/** IE10 and IE11 requires the following to support `@angular/animation`. */
import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/** Evergreen browsers require these. **/
import 'core-js/es6/reflect';
import 'core-js/es7/reflect';
/** ALL Firefox browsers require the following to support `@angular/animation`. **/
// import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/***************************************************************************************************
* Zone JS is required by Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
*/
/**
* Date, currency, decimal and percent pipes.
* Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
*/
// import 'intl'; // Run `npm install --save intl`.
tsconfig.spec.json -
tsconfig.spec.json -
"compilerOptions": {
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"es2016"
],
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es6",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts"
]
}
tsconfig.json
配置文件
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"target": "es5",
"experimentalDecorators": true,
"lib": [
"es2015"
]
}
}
回答by Sanjay Gupta
I was facing same issue after I updated my project from Angular 5 to 6. I found a solution with help of Derek Brown's comment. The solution is to add the following in the polyfill.tsfile:
将项目从 Angular 5 更新到 6 后，我遇到了同样的问题。我在 Derek Brown 的评论的帮助下找到了解决方案。解决方法是在polyfill.ts文件中添加以下内容：
if (!Element.prototype.matches) {
Element.prototype.matches = Element.prototype.msMatchesSelector;
}
回答by Michael Coxon
For those using Angular 6 and 7 (typescript) you should modify Sanjay Gupta's answer below with:
对于那些使用 Angular 6 和 7（打字稿）的人，你应该修改下面的 Sanjay Gupta 的答案：
if (!Element.prototype.matches) {
Element.prototype.matches = (<any>Element.prototype).msMatchesSelector ||
Element.prototype.webkitMatchesSelector;
}
The casting (well, untyping, really) allows the transpiler to parse the undefined method.
强制转换（好吧，实际上是取消类型化）允许转译器解析未定义的方法。
