在Angular2中,我遇到了加载内部ts文件的问题 . 在main.ts里面,我正在调用app.component .
错误是 Failed to load resource: the server responded with a status of 404 (Not Found)
Error: XHR error (404 Not Found) loading http://localhost:12228/app/app.component(…)
http://localhost:12228/node_modules/angular2/platform/browser Failed to load resource: the server responded with a status of 500 (Internal Server Error)
Main.ts
import {bootstrap} from '../node_modules/angular2/platform/browser';
import {AppComponent} from './app.component';
bootstrap(AppComponent);
app.component.ts
import {Component} from '../node_modules/angular2/core';
@Component({
selector: 'hello-world',
template: '<h1>Hello World From www.angulartypescript.com</h1><h2>Hallo</h2>'
})
export class AppComponent { }
Index.html
<!DOCTYPE html>
<html>
<head>
<title>Login</title>
<!--<script src="https://code.angularjs.org/2.0.0-beta.9/angular2-polyfills.js"></script>-->
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.8/angular2.dev.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/angular2.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/http.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.9/router.dev.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.1/underscore-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.0/backbone.localStorage-min.js"></script>
<script>
System.config({
map: {
app: 'assets/js/app'
},
packages: {
app: {
defaultExtension: 'js',
format: 'register'
}
}
});
System.import('app/main').then(null, console.error.bind(console));
</script>
<!--<script src="../node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="../node_modules/angular2/bundles/angular2-polyfills.min.js"></script>
<script src="../node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="../node_modules/angular2/bundles/angular2.js"></script>
<script src="../node_modules/angular2/bundles/angular2.min.js"></script>-->
<!-- 2. Configure SystemJS -->
</head>
<!-- Run the application -->
<body>
<h1>Angular 2 Form builder </h1>
<hello-world>Loading Sample...</hello-world>
</body>
</html>
请建议我如何解决这个问题 . 谢谢
3 回答
如果您在Visual Studio中运行您的应用程序,请更改
至
同时将文件扩展名更改为.js . 并确保您的文件"URL"指向该文件 .
你应该使用:
和
因为这些模块是由您导入的文件显式注册的(
https://code.angularjs.org/2.0.0-beta.9/angular2.min.js
)我遇到了类似的问题 . 花了大约3个小时后,我意识到我在错误的目录中运行了
ng serve
命令 .在启动角度项目之前,只需检查当前的工作目录 .