Angular 5 App Doesn't Render In IE11

- 1 answer

I have an Angular 5 app that works perfect in Chrome, Opera, Firefox and Edge. But in IE11 the app doesn't render. I include the polyfills.ts file and install the npm packages classlist.js and web-animations-js.

/** 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/weak-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 for the Reflect API. */
 import 'core-js/es6/reflect';

/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
import 'core-js/es7/reflect';

 * Web Animations `@angular/platform-browser/animations`
 * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
 * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
import 'web-animations-js';  // Run `npm install --save web-animations-js`.

 * By default, zone.js will patch all possible macroTask and DomEvents
 * user can disable parts of macroTask/DomEvents patch by setting following flags

 // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
 // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
 // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames

 * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
 * with the following flag, it will bypass `zone.js` patch for IE/Edge
// (window as any).__Zone_enable_cross_context_check = true;

 * Zone JS is required by default for Angular itself.
import 'zone.js/dist/zone';  // Included with Angular CLI.


In the IE11 console I got the following errors:

enter image description here

How can I get my app working in IE11?

Following the @Pako answer the app now renders in IE11 but raises an error when I try to make the login request

The object does not accept the property or the 'values' method

This error is caused by Object.values() since it's not supported in IE11.



Can try to add this code in the head of index.html

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

i think it work