找不到Angular2 http服務

Question

無法獲得一個簡單的http服務在angular2中工作。 出於某種原因，我剛剛獲得404服務。 它還不包含任何功能，但我似乎DI不起作用。

一旦我在引導應用程序時添加TestService，我就會得到以下內容。 獲取http://127.0.0.1:8080/testService 404（未找到）

的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

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

import {Http} from 'angular2/http';
import {Injectable} from 'angular2/core';

@Injectable()
export class TestService {
    constructor(public http: Http){        
    }
}

Answer 1

我剛碰到這個，通過添加腳本引用來修復它：http包：

<script src="node_modules/angular2/bundles/http.dev.js"></script>

記住我在實現路由后添加了類似的資源后嘗試了。 希望這有助於其他人！

Answer 2

這是因為默認情況下您的'http.dev.js'不是來源的

第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>

第2步： main.ts

添加導入並添加'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

導入Http並使用它

import {Http} from 'angular2/http';

constructor(http: Http) {
    http.get('http://jsonplaceholder.typicode.com/posts/1').subscribe((data) => {
      this.response = data._body;
    })
  }

Answer 3

您需要通過提供Http作為提供者來添加它。 有兩種方法可以實現此目的：

1）在全局級別，您可以指定何時引導應用程序：

bootstrap(AppComponent, [TestService, Http]);

2）在您嘗試使用它的組件內部：

@Component({
  ...
  providers: [Http]
})
public class ...

注意當您作為提供者提供時，您還必須import / require Http。 這將允許角度的DI識別將被注入的內容。

找不到Angular2 http服務

問題描述

3 個解決方案

解決方案1
14 2016-02-26 19:47:47

解決方案2
2 2016-04-26 09:35:38

解決方案3
0 2016-01-19 14:55:53

找不到Angular2 http服務

問題描述

3 個解決方案

解決方案1 14 2016-02-26 19:47:47

解決方案2 2 2016-04-26 09:35:38

解決方案3 0 2016-01-19 14:55:53

解決方案1
14 2016-02-26 19:47:47

解決方案2
2 2016-04-26 09:35:38

解決方案3
0 2016-01-19 14:55:53