Javascript Angular2 快速入门 - “无法获取”消息
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34800254/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular2 Quick Start - 'Cannot Get' Message
提问by Josiane Ferice
I've been trying to do the quick start guide for Angular2. I did the example as instructed in the quick guide. However, when I ran it, it displayed the following message 'Cannot Get'. Does anyone know why this is happening?
我一直在尝试编写 Angular2 的快速入门指南。我按照快速指南中的说明做了这个例子。但是，当我运行它时，它显示以下消息“无法获取”。有谁知道为什么会这样？
boot.js file
boot.js 文件
// JavaScript source code
(function (app) {
document.addEventListener('DOMContentLoaded', function () {
ng.platform.browser.bootstrap(app.AppComponent);
});
})(window.app || (window.app = {}));
The app.component.js file
app.component.js 文件
(function (app) {
app.AppComponent = ng.core.Component({
Selector: 'my-app',
template: '<h1>My First Angular 2 App </h1>'
})
.class({
constructor: function () { }
});
})(window.app || window.app == {});
The index file
索引文件
<html>
<head>
<title>Angular 2 QuickStart</title>
<!-- 1. Load libraries -->
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/Rx.umd.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-all.umd.dev.js"></script>
<!-- 2. Load our 'modules' -->
<script src='app/app.component.js'></script>
<script src='app/boot.js'></script>
</head>
<!-- 3. Display the application -->
<body>
<my-app>Loading...</my-app>
</body>
</html>
Finally, the package.json file
最后，package.json 文件
{
"name": "angular2-quickstart",
"version": "1.0.0",
"scripts": {
"start": "npm run lite",
"lite": "lite-server"
},
"license": "ISC",
"dependencies": {
"angular2": "2.0.0-beta.0",
"systemjs": "0.19.6",
"es6-promise": "^3.0.2",
"es6-shim": "^0.33.3",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.0",
"zone.js": "0.5.10"
},
"devDependencies": {
"lite-server": "^1.3.1"
}
}
I ran the line 'npm start' which opened the browser and displayed 'Cannot Get'
我运行了“npm start”这一行，它打开了浏览器并显示了“无法获取”
采纳答案by Josiane Ferice
I figured out what the issue was. I had an extra space in my html file which was causing the error. I removed the extra space, and it worked as expected.
我想出了问题所在。我的 html 文件中有一个额外的空间，这导致了错误。我删除了额外的空间，它按预期工作。
回答by Melaz
I got this error when index.html was not in the correct folder.
当 index.html 不在正确的文件夹中时，我收到此错误。
If that is the case, putting it in the main angular project's root folder should resolve the error.
如果是这种情况，将它放在主 angular 项目的根文件夹中应该可以解决错误。
回答by Brampage
Background
背景
I have had the same problem: Cannot GET / pagenameon every page. I searched the internet but did not found a solution like this one.
我有同样的问题：Cannot GET / pagename在每一页上。我搜索了互联网，但没有找到这样的解决方案。
My project resided inside a folder with ASCII spaces since the repository name also contained spaces.
我的项目位于一个带有 ASCII 空格的文件夹中，因为存储库名称也包含空格。
Answer
回答
The folder in which your project resides, should not contain any space or ASCII Character "%20".
项目所在的文件夹不应包含任何空格或 ASCII 字符“%20”。
After this change my project did not give the Cannot GET / pagenameerror.
在此更改之后，我的项目没有给出Cannot GET / pagename错误。
回答by SquirFly
I had the same issue because I forgot to add the bs-config.jsonfile that we can see in the "Final structure" part of the tutorial.
It should contain :
我遇到了同样的问题，因为我忘记添加bs-config.json我们可以在教程的“最终结构”部分看到的文件。它应该包含：
{
"server": {
"baseDir": "src",
"routes": {
"/node_modules": "node_modules"
}
}
}
回答by Vijay Jaiswal
Cannot GET / error comes when your angular project fails to compile. So, first ensure you are not having any error in your angular code and it compiles fine. Just use this command:
当您的 angular 项目无法编译时，无法获取/错误。因此，首先确保您的 angular 代码中没有任何错误并且编译正常。只需使用此命令：
ng serve
and it should list all issues your angular code has.
它应该列出您的 angular 代码的所有问题。
回答by Isak La Fleur
If you are using routes, make sure you have a correctly imported component pointing to the "" (/ route).
如果您正在使用路由，请确保您有一个正确导入的指向“”（/ 路由）的组件。
example:
{ path: "", component: MyHomeComponent }
例子：
{ path: "", component: MyHomeComponent }
Full example of app.module.tsin an Angular 5 installation (same same from Angular +2...)
app.module.tsAngular 5 安装的完整示例（与 Angular +2 相同...）
import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { FormsModule } from "@angular/forms";
import { HttpModule } from "@angular/http";
import { Routes, RouterModule } from "@angular/router";
import { AppComponent } from "./app.component";
import { CinemaService } from "./services/cinema.service";
import { MyHomeComponent } from "./components/my-home/my-home.component";
import { MyMovieComponent } from "./components/my-movie/my-movie.component";
const routes: Routes = [
{ path: "", component: MyHomeComponent },
{ path: "movie/:id", component: MyMovieComponent },
];
@NgModule({
declarations: [
AppComponent,
MyHomeComponent,
MyMovieComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
RouterModule.forRoot(routes)
],
providers: [CinemaService],
bootstrap: [AppComponent]
})
export class AppModule { }
回答by Tarek.Mostafa
I had the same issue with Angular.io example "minimal NgModule" They gave us the files with extra "0" in the file names. I solved the issue by converting only file name "index.0.html" to "index.html" It finally worked :)
我在 Angular.io 示例“最小 NgModule”中遇到了同样的问题，他们给了我们文件名中带有额外“0”的文件。我通过仅将文件名“index.0.html”转换为“index.html”解决了这个问题它终于奏效了:)
回答by Puneet Goel
You need to run 'ng serve' command where your 'src' folder lies.
您需要在“src”文件夹所在的位置运行“ng serve”命令。
回答by Cyril Edison
I got this error just because I made some changes in angular-cli.jsonfile then I ran my app and got error as
我收到这个错误只是因为我对angular-cli.json文件做了一些更改然后我运行了我的应用程序并得到了错误
" Cannot GET / ".
Then I removed the changes made in angular-cli.jsonfile and ran the app. It was working fine.
然后我删除了在angular-cli.json文件中所做的更改并运行了该应用程序。它工作正常。
