无法读取未定义的属性 'split'

Question

我的本地服务器上有以下代码运行ning。

<!DOCTYPE html>
<html>
<head>
   <link rel="stylesheet" href="style.css">
   <script src="https://jspm.io/system@0.16.js"></script>
   <script src="https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js"></script>
</head>
<body>
  <my-app></my-app>
  <script>
     System.config({
       paths: {
          '*': '*.js',
          'angular2/*': 'angular2/*'
      }
 });
 System.import('main');
</script>
</body>
</html>

以上是index.html页。

import {Component, View, bootstrap} from 'angular2/angular2';

@Component({
  selector: 'my-app'
})
@View({
  template: '<h1>My first Angular 2 App</h1>'
})
class AppComponent {
}

bootstrap(AppComponent);

以上是main.js文件。

当我运行在服务器上执行此操作时，我在控制台中得到以下信息。

http://localhost:63342/es6/main.js:3:1: Unexpected token @
angular2.dev.js:752 TypeError: Error loading "main" at      http://localhost:63342/es6/main.js
Cannot read property 'split' of undefined
angular2.dev.js:753 TypeError: Error loading "main" at http://localhost:63342/es6/main.js
Cannot read property 'split' of undefined
  at Zone.longStackTraceZone.getLongStacktrace (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:728:35)
  at Zone.longStackTraceZone.onError (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:753:19)
  at Zone.run (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:92:14)
  at zoneBoundFn (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:66:19)
  at D (https://jspm.io/es6-module-loader@0.16.5.js:1:7439)
  at I (https://jspm.io/es6-module-loader@0.16.5.js:1:7071)
  at O.7.O.when (https://jspm.io/es6-module-loader@0.16.5.js:1:10745)
  at w.7.w.run (https://jspm.io/es6-module-loader@0.16.5.js:1:9781)
  at e.3.e._drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1740)
  at 3.e.drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1394)
--- Sun Apr 26 2015 08:27:39 GMT+0530 (IST) - 738ms ago
 Error
  at Function.getStacktraceWithUncaughtError (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:699:32)
  at Zone.longStackTraceZone.fork (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:758:43)
  at Zone.bind (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:64:21)
  at Function.Zone.bindArguments (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:195:22)
  at t.fnNames.forEach.obj.(anonymous function) [as then] (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:186:42)
  at k (https://jspm.io/es6-module-loader@0.16.5.js:1:21515)
  at https://jspm.io/es6-module-loader@0.16.5.js:1:22664
  at Zone.run (https://code.angularjs.org/2.0.0-   alpha.19/angular2.dev.js:89:19)
  at zoneBoundFn (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:66:19)
  at D (https://jspm.io/es6-module-loader@0.16.5.js:1:7439)
--- Sun Apr 26 2015 08:27:39 GMT+0530 (IST) - 739ms ago
Error
  at Function.getStacktraceWithUncaughtError (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:699:32)
  at Zone.longStackTraceZone.fork (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:758:43)
  at Zone.bind (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:64:21)
  at Function.Zone.bindArguments (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:195:22)
  at t.fnNames.forEach.obj.(anonymous function) [as then] (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:186:42)
  at x.import (https://jspm.io/es6-module-loader@0.16.5.js:1:22539)
  at x.$__global.upgradeSystemLoader.e.import (https://jspm.io/system@0.16.7.js:5:1180)
  at http://localhost:63342/es6/index.html:17:18
 angular2.dev.js:752 TypeError: Cannot read property '__useDefault' of    undefined
angular2.dev.js:753 TypeError: Cannot read property '__useDefault' of undefined
  at https://jspm.io/system@0.16.7.js:5:1220
  at Zone.run (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:89:19)
  at zoneBoundFn (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:66:19)
  at D (https://jspm.io/es6-module-loader@0.16.5.js:1:7439)
  at I (https://jspm.io/es6-module-loader@0.16.5.js:1:7071)
  at O.7.O.when (https://jspm.io/es6-module-loader@0.16.5.js:1:10745)
  at w.7.w.run (https://jspm.io/es6-module-loader@0.16.5.js:1:9781)
  at e.3.e._drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1740)
  at 3.e.drain (https://jspm.io/es6-module-loader@0.16.5.js:1:1394)
  at MutationObserver.t (https://jspm.io/es6-module-loader@0.16.5.js:1:3302)
--- Sun Apr 26 2015 08:27:39 GMT+0530 (IST) - 742ms ago
Error
  at Function.getStacktraceWithUncaughtError (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:699:32)
  at Zone.longStackTraceZone.fork (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:758:43)
  at Zone.bind (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:64:21)
  at Function.Zone.bindArguments (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:195:22)
  at t.fnNames.forEach.obj.(anonymous function) [as then] (https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js:186:42)
  at x.$__global.upgradeSystemLoader.e.import (https://jspm.io/system@0.16.7.js:5:1195)
  at http://localhost:63342/es6/index.html:17:18

以上代码取自angular.io, the official angular 2 website. If the same code is executed in plunkr，我得到的输出是"My first Angular 2 App"，但我的本地没有。

我是不是漏掉了什么？

Answer 1

问题出在您声明 angular 应用程序的文件名上。

应该是main.es6.js而不是main.js

文件名格式应始终为 System.import('main') 中指定的名称，即 main. + es6. + js

Read this article for better uderstanding

Answer 2

看来我们必须导入 traceur-runtime.js 并设置 traceur 选项。

这是plunker link

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="https://github.jspm.io/jmcriffey/bower-traceur-runtime@0.0.87/traceur-runtime.js"></script>
<script src="https://jspm.io/system@0.16.js"></script>
<script src="https://code.angularjs.org/2.0.0-alpha.19/angular2.dev.js"></script>
</head>
<body>
<my-app></my-app>
<script>
System.config({
    traceurOptions: {
        annotations: true,
        memberVariables: true,
        types: true
    },
    paths: {
        '*': '*.js',
        'angular2/*': 'angular2/*'
    }
});
System.import('main');
</script>
</body>
</html>

无法读取未定义的属性 'split'

Cannot read property 'split' of undefined

components

annotations

typescript

angular

无法读取未定义的 属性 'split'

Cannot read property 'split' of undefined

components

annotations

typescript

angular

无法读取未定义的属性 'split'