找不到Angular2 http服务
[英]Angular2 http service not found
问题描述
cant get a simple http service to work in angular2. 
无法获得一个简单的http服务在angular2中工作。 I just get 404 on the service for some reason. 出于某种原因，我刚刚获得404服务。 It does not contain any functionality yet, but I seems that the DI does not work. 它还不包含任何功能，但我似乎DI不起作用。
As soon as I add TestService when bootstrapping the application i get the following. 一旦我在引导应用程序时添加TestService，我就会得到以下内容。 GET http://127.0.0.1:8080/testService 404 (Not Found) 获取http://127.0.0.1:8080/testService 404（未找到）
index.html 的index.html
<!DOCTYPE html>
<html lang="en-GB">
<head>
<title>AngularJS 2 Tutorial Series</title>
<script src="https://code.angularjs.org/2.0.0-beta.0/angular2-polyfills.js"></script>
<script src="https://code.angularjs.org/tools/system.js"></script>
<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.1/angular2.dev.js"></script>
<script>
System.config({
transpiler: 'typescript',
typescriptOptions: { emitDecoratorMetadata: true }
});
System.import('./app/app.ts');
</script>
</head>
<body>
<my-app>loading...</my-app>
</body>
</html>
app.ts app.ts
import {bootstrap} from 'angular2/platform/browser';
import {Component} from 'angular2/core';
import {Injectable} from 'angular2/core'
import {TestService} from 'testService';
@Component({
selector: 'my-app',
template: '<h1>My First Angular 2 App</h1>',
})
class AppComponent {
}
bootstrap(AppComponent, [TestService]);
TestService.ts TestService.ts
import {Http} from 'angular2/http';
import {Injectable} from 'angular2/core';
@Injectable()
export class TestService {
constructor(public http: Http){
}
}
3 个解决方案
解决方案1
14 2016-02-26 19:47:47
I just ran into this, fixed it by adding the script reference to the http bundle: 我刚碰到这个，通过添加脚本引用来修复它：http包：
<script src="node_modules/angular2/bundles/http.dev.js"></script>
Tried it after remembering that I added a similar resource after implementing routing. 记住我在实现路由后添加了类似的资源后尝试了。 Hope this helps someone else! 希望这有助于其他人！
解决方案2
2 2016-04-26 09:35:38
This is because by Default your 'http.dev.js' is not sourced 这是因为默认情况下您的'http.dev.js'不是来源的
Step 1 : index.html 第1步 ： index.html
Include 'http.dev.js'
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script>
Step 2: main.ts 第2步： main.ts
Add import and add 'HTTP_PROVIDERS' 添加导入并添加'HTTP_PROVIDERS'
import {bootstrap} from 'angular2/platform/browser';
import { HTTP_PROVIDERS } from 'angular2/http';
import {AppComponent} from './app.component';
bootstrap(AppComponent, [HTTP_PROVIDERS]);
STEP: 3 app.component.ts STEP：3 app.component.ts
import Http and use it 导入Http并使用它
import {Http} from 'angular2/http';
constructor(http: Http) {
http.get('http://jsonplaceholder.typicode.com/posts/1').subscribe((data) => {
this.response = data._body;
})
}
解决方案3
0 2016-01-19 14:55:53
You will need to add Http by supplying it as a provider. 您需要通过提供Http作为提供者来添加它。 There are 2 ways to accomplish this: 有两种方法可以实现此目的：
1) at a global level you can specify when you bootstrap the application: 1）在全局级别，您可以指定何时引导应用程序：
bootstrap(AppComponent, [TestService, Http]);
2) inside the component you are trying to use it within: 2）在您尝试使用它的组件内部：
@Component({
...
providers: [Http]
})
public class ...
NOTE you will also have to import / require Http when you are supplying it as a provider. 注意当您作为提供者提供时，您还必须import / require Http。 This will allow angular's DI to discern what will be injected. 这将允许角度的DI识别将被注入的内容。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.