fait jusqu'a Q14 + un peut de css

src/app/my-component/my-component.component.ts

@@ -1,20 +1,23 @@
 import { Component } from '@angular/core';
 //import { constructor } from 'jasmine';
-import { Pokemon } from '../pokemon';
+import { PokeDetail, Pokemon } from '../pokemon';
+import { PokeAPIServiceService } from '../poke-apiservice.service';
 
 @Component({
   selector: 'app-my-component',
   templateUrl: './my-component.component.html',
-  styleUrl: './my-component.component.css'
+  styleUrl: './my-component.component.css',
+  providers: [PokeAPIServiceService] 
 })
 export class MyComponentComponent {
   id: string;
   selectedPokeId : string;
   searchPokeName: string;
-
+  pokeDetail : PokeDetail;
   pokes : Pokemon[] = [];
 
-  constructor(){
+  constructor(private pokeService: PokeAPIServiceService){
+    /*this.pokes.push(new Pokemon('1', "Bulbizarre"));
     this.pokes.push(new Pokemon('2', "Herbizarre"));
     this.pokes.push(new Pokemon('3', "Florizarre"));
     this.pokes.push(new Pokemon('4', "Salamèche"));
@@ -22,9 +25,23 @@ export class MyComponentComponent {
     this.pokes.push(new Pokemon('6', "Dracaufeu"));
     this.pokes.push(new Pokemon('7', "Carapute"));
     this.pokes.push(new Pokemon('8', "Carabaffe"));
-    this.pokes.push(new Pokemon('9', "Tortank"));
+    this.pokes.push(new Pokemon('9', "Tortank"));*/
   }
 
   ngOnInit(): void {
+    this.pokeService.getPokemons().subscribe((data)=>{
+      data.results.forEach((e,index) =>{
+        this.pokes.push(new Pokemon((index+1)+'', e.name));
+      })
+    }
+  );
+  };
+
+
+  go(){
+    this.id=this.selectedPokeId;
+    if (this.selectedPokeId != ''){
+      this.pokeService.getPokemonInfo(this.selectedPokeId).subscribe(data=> this.pokeDetail = data)
+    }
   }
 }