I am building an application in angular8. I worked on angular5/6/7 and for those applications, I uncommented the imports that exist in the polyfills.ts. For angular 8, it has only 3 imports i.e classlist.js, web-animation-js and zone.js/dist/zone. My application is working fine in IE. But I started using the includes function to see if an item exists. It works fine in chrome. In IE it throws Object doesn't support property or method 'includes' error.
In polyfill.js
add the below line:
import 'core-js/es7/array';
With respect to Angular 8+, they added differential loading by default; where modern browsers (like Chrome and FF) will load an es2015 compatible JS file and legacy browsers (like IE11) will load another but same functioning es5 JS file.
In order to get polyfills into your es5 file (to be loaded by IE11), you need to add them manually to the src/polyfills.ts
file.
// Only load the 'includes' polyfill
import 'core-js/features/array/includes';
Or you can just add all polyfills:
// polyfill all `core-js` features:
import "core-js";
CommonJS API
section on the other ways to add polyfillsincludes
is a function that exist on Array.prototype
and String.prototype
and it is not supported on IE. You need to use a polyfill like the following:
if (!String.prototype.includes) {
String.prototype.includes = function(search, start) {
'use strict';
if (typeof start !== 'number') {
start = 0;
}
if (start + search.length > this.length) {
return false;
} else {
return this.indexOf(search, start) !== -1;
}
};
}
Or similar for Arrays. You can also check Core.js for polyfills
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With