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,
theDataSource: Observable<any>;
où any
peut (ou devrait être si possible) être un type plus concret qui correspond au type des valeurs qu'il est censé émettre.
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.
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) =>