3

所以我开始学习 Angular，我从 2.0 开始，因为它会打破 1 到那时我正在尝试从 Angular 网站获取快速启动应用程序工作

我按照说明设置了代码，并在 IIS 中设置了一个网站以指向源代码目录，但出现错误。

Uncaught (in promise) Error loading "app" at http://localhost:88/app.js
http://localhost:88/app.js:1:46: Unexpected token angular2

有没有人在 IIS 中设置了这个应用程序，如果有，你能帮忙吗？

文件 app.js：

import {Component, Template, bootstrap} from angular2/angular2;

//Annotation section
@Component({
    selector: 'my-app'
})

@Template({
    inline: '<h1>Hello {{name}}</h1>'
})

//Component controller
class MyAppConponent{
    constuctor(){
        this.name = 'Alice';
    }
}

bootstrap(MyAppConponent);

文件 index.html

<!-- index.html -->
<html>
    <head>
        <title>Angular 2 Quickstart</title>
        <script src="/quickstart/dist/es6-shim.js"></script>
    </head>
    <body>
        <!-- The app component created in app.es6 -->
        <my-app></my-app>

        <script>
            // Rewrite the paths to load the files
            System.paths = {
                'angular2/*':'/quickstart/angular2/*.js', // Angular
                'rtts_assert/*': '/quickstart/rtts_assert/*.js', // Runtime assertions
                'app': 'app.js' // The my-app component
            };
            // Kick off the application
            System.import('app');
        </script>

    </body>
</html>

另外-我确实将应用程序文件命名为app.es6，正如网站所示，但我看到扩展是否有所不同，因为es6是新的javascript标准，浏览器可能还不支持它，我得到了

GET http://localhost:88/app.es6 404（未找到）

作为该扩展名的错误。

我正在为我的浏览器使用 Chrome Canary

4

3 回答 3

2

看起来像语法错误

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

应该修

于 2015-03-25T16:30:19.927 回答
0

这是我想出的最终产品。

在 app.ts

/// <reference path="typings/angular2/angular2.d.ts" />
///<reference path="typings/es6-promise/es6-promise.d.ts"/>
///<reference path="typings/rx/rx.d.ts"/>

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

@Component({
    selector : 'my-app'
})
@View({
    templateUrl: '<h1>Hello {{name}}<h1>'
})
// Component controller
class MyAppComponent {
    name : string;
    constructor(){
        this.name = 'Alice';
    }
}

bootstrap(MyAppComponent);

在 index.html 中

<!DOCTYPE html>
<!-- index.html -->
<html>
  <head>
    <title>Angular 2 Quickstart</title>
    <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.23/angular2.dev.js"></script>
  </head>
  <body>

    <!-- The app component created in app.ts -->
    <my-app></my-app>
    <script>System.import('app');</script>
  </body>
</html>

我认为它不会影响您代码的完整性，但您的控制器拼写错误。

于 2015-06-14T03:53:08.020 回答
0

app.js 应该是 app.ts。确保您的 typescript watcher 已设置，然后重新启动应用程序。

于 2015-12-21T18:46:33.217 回答