web-dev-qa-db-fra.com

Le type générique 'Observable <T>' nécessite 1 argument de type

Ci-dessous, le code angulaire 2 (TypeScript) m'a donné une erreur ci-dessous 3, comment les résoudre. veuillez suggérer.

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { NgModule, Component } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule, Http } from '@angular/http';
import 'rxjs/add/operator/map';
import { Observable } from "rxjs/Observable";

@Component({
    selector: 'http-client',
    template: `<h1>All Products</h1>
  <ul>
    <li *ngFor="let product of products">
       {{product.title}}
    </li>
  </ul>
  `})
class AppComponent {

    products: Array<string> = [];

    theDataSource: Observable;

    constructor(private http: Http) {

        this.theDataSource = this.http.get('api/products/')
            .map(res => res.json());
    }

    ngOnInit() {
        // Get the data from the server
        this.theDataSource.subscribe(
            data => {
                if (Array.isArray(data)) {
                    this.products = data;
                } else {
                    this.products.Push(data);
                }
            },
            err =>
                console.log("Can't get products. Error code: %s, URL: %s ", err.status, err.url),
            () => console.log('Product(s) are retrieved')
        );
    }
}

@NgModule({
    imports: [BrowserModule,
        HttpModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
class AppModule { }

platformBrowserDynamic().bootstrapModule(AppModule);

Les erreurs sont,

  1. TS2314 Le type générique 'Observable' nécessite 1 argument de type.
  2. TS7006 Le paramètre 'data' a implicitement un type 'quelconque'.
  3. TS7006 Le paramètre 'err' a implicitement un type 'quelconque'.
8
shazia perween
theDataSource: Observable<any>;

any peut (ou devrait être si possible) être un type plus concret qui correspond au type des valeurs qu'il est censé émettre.

30
Günter Zöchbauer

Si vous regardez dans la source du module Http angulaire, vous pouvez trouver la méthode request de la classe Http

https://github.com/angular/angular/blob/2.4.1/modules/%40angular/http/src/http.ts#L111

Toutes les autres méthodes (get, post, etc.) encapsulent cette demande. Vous pouvez également constater que la demande renvoie un observable avec le générique de la classe Response. La classe de réponse fait partie du module Http, votre code peut donc être modifié comme suit:

import { HttpModule, Http, Response } from '@angular/http';
...
theDataSource: Observable<Response>;

Ou, si vous n'avez pas besoin de cette typification forte, vous pouvez passer any en tant que paramètre de generic

theDataSource: Observable<any>;

Mais à mon avis, une forte typification est un meilleur choix. 

6
AlexFreem

1) theDataSource: Observable; -> theDataSource: Observable<any>;

2/3) vous pouvez ajouter "noImplicitAny": false à votre tsconfig.json

ou changez data => et err => avec (data: any) => et (err: any) =>

2
eko