所以我开始学习Angular,我从2.0开始,因为它会打破1 到那时,我试图让角网站上的quick start application工作
我按照指示设置代码并在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);
file 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标准,浏览器可能不支持它然而,我得到了
获取http://localhost:88/app.es6 404(未找到)
作为该扩展程序的错误。
我在浏览器中使用Chrome Canary
答案 0 :(得分:2)
看起来像语法错误
import {Component, Template, bootstrap} from 'angular2/angular2';
应该解决它
答案 1 :(得分: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>
我认为这不会影响代码的完整性,但是您的控制器拼写错误。
答案 2 :(得分:0)
app.js应该是app.ts.确保您的打字稿观察者已设置,然后重新启动应用程序。