Angular (IONIC) - Impossible de lire la propriété 'getInfos' d'undefined

Question

J'ai suivi un "tutoriel" où je peux lire une API à partir d'Angular. Lorsque j'ouvre mon Symfony, je peux lire le endpoint avec un GET et un POST (avec Postman aussi).

  ngOnInit() {
    try {
      return this.infosService.getAllInfos()
          .subscribe(data => this.infos = data);
    } catch(e) {
      console.log("TEST KO");
    }
  }

Dans mon fichier infos.service.ts, j'ai obtenu ces lignes pour obtenir les données, mais je n'ai appelé que getAllInfos dans cet exemple :

  apiUrl='Http://localhost:8000/api/info';

  constructor(private _http: HttpClient) { }
    getInfos() {
        return this._http.get<Infos[]>(this.apiUrl);
    }

    getAllInfos() {
        return this._http.get<Infos[]>(this.apiUrl);
    }

Merci : https://stackblitz.com/edit/ionic-hnz4eg?devtoolsheight=33&file=app/infos-render/infos-render.component.html

Où me suis-je trompé ?

Answer 1

Vous n'avez pas importé HttpClientModule et vous n'avez pas correctement fourni InfosService dans app.module :

import { NgModule, ErrorHandler } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { IonicApp, IonicModule, IonicErrorHandler } from "ionic-angular";
import { MyApp } from "./app.component";
import { HttpClientModule } from "@angular/common/http";

import { AboutPage } from "../pages/about/about";
import { ContactPage } from "../pages/contact/contact";
import { HomePage } from "../pages/home/home";
import { TabsPage } from "../pages/tabs/tabs";
import { InfosService } from "./services/infos/infos.service";
import { InfosRenderComponent } from "./infos-render/infos-render.component";

@NgModule({
  declarations: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage,
    InfosRenderComponent
  ],
  imports: [BrowserModule, IonicModule.forRoot(MyApp), HttpClientModule],
  bootstrap: [IonicApp],
  entryComponents: [MyApp, AboutPage, ContactPage, HomePage, TabsPage],
  providers: [
    { provide: ErrorHandler, useClass: IonicErrorHandler },
    InfosService
  ]
})
export class AppModule {}

ou vous pouvez voir l'intégralité aquí