什么是需要在IE9使用角2? [英] What is required to use Angular 2 within IE9?

查看:414
本文介绍了什么是需要在IE9使用角2?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在试图建立一个角2应用程序(使用上手指南)作为模板,但是当它的作品真的很好在Chrome我挣扎得到它在IE9工作!

I've been trying to create an Angular 2 application (using the get started guide) as a template but while it works really well in Chrome I'm struggling to get it working in IE9!

基本上应用程序被加载时运行的引导/ JS,出现以下错误报告给开发者控制台/失败。

Basically the app is failing while loading/running boot/js with the following error reported to the developer console..

LOG:错误:对象不支持此操作。

LOG: Error: Object doesn't support this action

有没有人有任何建议或意见 - 甚至更好 - 实际工作在IE9中演示

Does anyone have any recommendations or suggestions - even better - a demo that actually works in IE9?

我的index.html的开始看起来如下...

The start of my index.html looks like the following...

<head>
<title ng-bind="title">xxx</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
<base href="/">

<link rel="stylesheet" href="/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/main.css" />

</body>

<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.4.1/es5-sham.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.34.1/es6-sham.min.js"></script>
<script src="/app/shims_for_IE.js"></script>
<script src="https://rawgithub.com/systemjs/systemjs/0.19.6/dist/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/angular2.dev.js"></script>

<script>
    System.config({
    packages: {        
      app: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
  System.import('app/boot')
        .then(null, function(err){
            console.log(err);
        });
</script>

随着角code以下 https://angular.io/docs/ TS /最新/ quickstart.html 信!

With the Angular code following https://angular.io/docs/ts/latest/quickstart.html to the letter!

更新1:
随着更多的测试(主要是在新的IE浏览器)我experiancing同样的问题,但看到更多的细节。

Update 1: With a bit more testing (mostly in newer IE browsers) I am experiancing the same issue but seeing more details..

    TypeError: Object doesn't support property or method 'keys'
   at Anonymous function (http://localhost:5000/app/angular2.dev.js:783:5)
   at Anonymous function (http://localhost:5000/app/angular2.dev.js:781:3)
   at linkDynamicModule (https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js:3130:5)
   at getModule (https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js:3098:9)
   at Anonymous function (https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js:3134:9)
   at Anonymous function (http://localhost:5000/app/angular2.dev.js:10795:3)
   at linkDynamicModule (https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js:3130:5)
   at getModule (https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js:3098:9)
   at Anonymous function (https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js:3134:9)
   at Anonymous function (http://localhost:5000/app/angular2.dev.js:12011:3)

中的index.html目前看起来像..

The index.html currently looks like..

<head>
<title ng-bind="title">xxx</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
<base href="/">

<link rel="stylesheet" href="/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

<link rel="stylesheet" href="/css/style.css" />
<link rel="stylesheet" href="/css/main.css" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.4.1/es5-sham.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.34.1/es6-sham.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/angular2-polyfills.js"></script>

<script src="https://code.angularjs.org/tools/typescript.js"></script>

<script src="/app/reflect.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system.src.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.16/system-polyfills.src.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/Rx.js"></script>
<!--<script src="https://code.angularjs.org/2.0.0-beta.1/angular2.dev.js"></script>-->
<script src="/app/angular2.dev.js"></script>



<script src="/app/shims_for_IE.js"></script>


<script>
    System.config({
    packages: {        
      app: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
  System.import('app/boot')
        .then(function(){
        }, function(err){
            console.log(err.stack);
        });
</script>

推荐答案

于是,经过几个小时的揪头发,谈话在这里的@kevinB(感谢),并最终提高了票的 https://github.com/angular/angular/issues/6479#issuecomment-171582759

So, after several hours of hair pulling, a conversation on here with @kevinB (thanks) and eventually raising a ticket https://github.com/angular/angular/issues/6479#issuecomment-171582759

事实证明这是人为的错误!

it turns out it was human error!!

我复制/粘贴从CloudFlare的CDN网站上的错误链接,引用ES6-SH m.js代替ES6-SH m.js

I had copy/pasted the wrong links from the cloudflare CDN site, referencing es6-sham.js instead of es6-shim.js

这么小的错字 - !但有大量的后果

Such a small typo - but with massive consequences!

这篇关于什么是需要在IE9使用角2?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆