[转]Angular 2 / 4 / 5 not working in IE11
本文转自:https://stackoverflow.com/questions/35140718/angular-2-4-5-not-working-in-ie11/47777695#47777695
The latest version of angular is only setup for evergreen browsers by default...
The current setup is for so-called "evergreen" browsers; the last versions of browsers that automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
This also includes firefox, although not mentioned.
See here for more information on browser support along with a list of suggested polyfills for specific browsers. https://angular.io/guide/browser-support#polyfill-libs
This means that you manually have to enable the correct polyfills to get Angular working in IE11 and below.
To achieve this, go into polyfills.ts (in the src folder by default) and just uncomment the following imports:
/***************************************************************************************************
* 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';
Note that the comment is literally in the file, so this is easy to find.
If you are still having issues, you can downgrade the target property to es5 in tsconfig.json as @MikeDub suggested. What this does is change the compilation output of any es6 definitions to es5 definitions. For example, fat arrow functions (()=>{}) will be compiled to anonymous functions (function(){}). You can find a list of es6 supported browsers here.
For me with iexplorer 11 and Angular 2 I fixed all those above issues by doing 2 things:
in index.html add:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
in src\polyfills.ts uncomment:
/** 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';
https://angular.io/guide/quickstart
[转]Angular 2 / 4 / 5 not working in IE11的更多相关文章
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- Angular企业级开发(5)-项目框架搭建
1.AngularJS Seed项目目录结构 AngularJS官方网站提供了一个angular-phonecat项目,另外一个就是Angular-Seed项目.所以大多数团队会基于Angular-S ...
- TypeScript: Angular 2 的秘密武器(译)
本文整理自Dan Wahlin在ng-conf上的talk.原视频地址: https://www.youtube.com/watch?v=e3djIqAGqZo 开场白 开场白主要分为三部分: 感谢了 ...
- angular实现统一的消息服务
后台API返回的消息怎么显示更优雅,怎么处理才更简洁?看看这个效果怎么样? 自定义指令和服务实现 自定义指令和服务实现消息自动显示在页面的顶部,3秒之后消失 1. 显示消息 这种显示消息的方式是不是有 ...
- div实现自适应高度的textarea,实现angular双向绑定
相信不少同学模拟过腾讯的QQ做一个聊天应用,至少我是其中一个. 过程中我遇到的一个问题就是QQ输入框,自适应高度,最高高度为3row. 如果你也像我一样打算使用textarea,那么很抱歉,你一开始就 ...
- Angular企业级开发-AngularJS1.x学习路径
博客目录 有链接的表明已经完成了,其他的正在建设中. 1.AngularJS简介 2.搭建Angular开发环境 3.Angular MVC实现 4.[Angular项目目录结构] 5.[SPA介绍] ...
- Angular企业级开发(4)-ngResource和REST介绍
一.RESTful介绍 RESTful维基百科 REST(表征性状态传输,Representational State Transfer)是Roy Fielding博士在2000年他的博士论文中提出来 ...
- Angular企业级开发(3)-Angular MVC实现
1.MVC介绍 Model-View-Controller 在20世纪80年代为程序语言Smalltalk发明的一种软件架构.MVC模式的目的是实现一种动态的程序设计,使后续对程序的修改和扩展简化,并 ...
- Angular企业级开发(2)-搭建Angular开发环境
1.集成开发环境 个人或团队开发AngularJS项目时,有很多JavaScript编辑器可以选择.使用优秀的集成开发环境(Integrated Development Environment)能节省 ...
随机推荐
- STM32 + RC522(SPI2 和 模拟SPI)
STM32 + RC522(SPI2 和 模拟SPI) 一. STM32 + RC522(SPI2 模式) 1. 头文件: rc522.h #include "stm32f10x.h&quo ...
- jquery print属性设置
一,需求背景 项目中遇到打印功能,想实现完美的打印功能,对元素进行操作等,可以使用jquery print 插件. 二,依赖文件 git地址请戳这里 1,jquery 2,jquery.print- ...
- PowerShell 使用.NetFramework
我们都知道,由于PowerShell是基于.NETFramework建立的所以它能够具备访问.NET的能力,因为.NET提供了庞大的数据类库,所以我们可以很好的使用PowerShell去完成一些Pow ...
- No趴笨小分队
这星期完成了小组的取名这一项重大的活动. 正所谓“名字是一个好开头”,取这个名义有以下的意义: 希望之后的学习以及工作能一帆风顺: 祝福各位小组成员之后的路能顺顺利利: 希望能在组员磨合的过程中可以愉 ...
- Visual Studio 代码快捷键
目录 1.常用快捷键 2.快速生成代码 3.自定义代码片段 参考: https://blog.csdn.net/qq_32452623/article/details/53838393 https:/ ...
- Android开发 - 设置DialogFragment全屏显示
默认的DialogFragment并不是全屏,但有些需求需要我们将对话框设置为全屏(内容全屏),Android并没有提供直接的API,通过其它不同的方法设置全屏在不同的机型上总有一些诡异的问题,经过测 ...
- FTPClient 中 FTPClient.changeWorkingDirectory(filePath) 代码一直返回 false
FTP文件下载需要的jar包: commons-net-2.0.jar 有时可能还需要:jakarta-oro.jar 参考:FTPClient参考文档 这里记录下我碰到的问题: 刚开始我的账号和密 ...
- 第二十四节:Java语言基础-讲解数组的综合应用
数组的综合应用 // 打印数组 public static void printArray(int[] arr) { for(int x=0;x<arr.length;x++) { if(x!= ...
- antd在webpack里面的配置
概述 antd是蚂蚁金服打造的一个react组件,真的非常棒,我看了下官方文档,感觉比bootstrap要好.唯一的缺点可能就是打包的时候要打包它的一些样式表,所以资源体积会很大,并且css可能会和自 ...
- JS应用实例5:全选、动态添加
HTML代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...