typescript - provided - HTTP angular 2 "No se pueden resolver todos los parámetros para ''AppService''"

injector angular 4

Question

Traté de importar el proveedor http a un servicio, pero recibo el siguiente error:

No se pueden resolver todos los parámetros para ''AppService'' (?). Asegúrese de que todos los parámetros estén decorados con Inject o que tengan anotaciones de tipo válidas y que ''AppService'' esté decorado con Injectable.

Aquí hay algunos fragmentos de código:

<script src="~/es6-shim/es6-shim.min.js"></script>
<script src="~/systemjs/dist/system-polyfills.js"></script>

<script src="~/angular2/bundles/angular2-polyfills.js"></script>
<script src="~/systemjs/dist/system.src.js"></script>
<script src="~/rxjs/bundles/Rx.js"></script>
<script src="~/angular2/bundles/angular2.dev.js"></script>
<script src="~/angular2/bundles/http.dev.js"></script>

<!-- 2. Configure SystemJS -->
<script>
    System.config({
        map: { ''rxjs'': ''RCO/rxjs'' },
        packages: {
            RCO: {
                format: ''register'',
                defaultExtension: ''js''
            },
            ''rxjs'': {defaultExtension: ''js''}
        }
    });
  System.import(''RCO/Areas/ViewOrganization/AngularTemplates/boot'')
      .then(null, console.error.bind(console));

boot.ts

import {bootstrap} from ''angular2/platform/browser''
import {HTTP_PROVIDERS} from ''angular2/http''
import ''rxjs/add/operator/map''
import {AppComponent} from  ''RCO/Areas/ViewOrganization/AngularTemplates/app.component''
import {AppService} from ''RCO/Areas/ViewOrganization/AngularTemplates/app.service''

bootstrap(AppComponent, [HTTP_PROVIDERS, AppService]);

app.service.ts

import {Injectable} from ''angular2/core'';
import {Http, Response} from ''angular2/http'';
import {Observable} from ''rxjs/Rx'';

@Injectable()
export class AppService {

    constructor(private http: Http) { }

    // Uses http.get() to load a single JSON file
    getTableData() {
        return this.http.get(''...'').map((res: Response) => res.json());
    }

}

Intento llamar a un controlador en el servidor para eventualmente cargar un archivo JSON en una tabla de datos. Bastante sencillo, pero la forma en que estoy cargando los módulos Http parece estar mal. Cualquier ayuda será muy apreciada.

Answer 1

Otra forma de hacerlo, que ahorra algo de tipeo en el futuro sería:

en su tsconfig.json add compilerOptions.emitDecoratorMetadata=true

ejemplo de tsconfig.json simple sería:

{
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true
  }
}

Answer 2

Parece que no está utilizando el compilador de typescript para transpilar archivos a js , en ese caso necesita tener el uso de @Inject mientras inyecta cualquier dependencia dentro de un constructor de componente.

import {Injectable, Inject} from ''angular2/core'';
import {Http, Response} from ''angular2/http'';
import {Observable} from ''rxjs/Rx'';

@Injectable()
export class AppService {
    constructor(@Inject(Http) private http: Http) { }
    // Uses http.get() to load a single JSON file
    getTableData() {
        return this.http.get(''...'').map((res: Response) => res.json());
    }
}

Answer 3

Tuve el mismo problema, y ​​para mí el problema era que me faltaba la import { HttpModule } from ''@angular/http'' en app.module.ts