Ajout model et ngFor

src/app/components/page-trombinoscope/page-trombinoscope.component.html

 <main bp="grid 3">
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
-  <app-trombinoscope-card></app-trombinoscope-card>
+  <app-trombinoscope-card
+    *ngFor="let person of persons"
+    [person]="person">
+  </app-trombinoscope-card>
 </main>

src/app/components/trombinoscope-card/trombinoscope-card.component.html

-<div class="card">
-  <h2 bp="text-center">{{ prenom }} {{ nom }}</h2>
-  <img [src]="image">
+<div *ngIf="person" class="card">
+  <h2 bp="text-center">{{ person.fullName }}</h2>
+  <img [src]="person.image">
 </div>

src/app/models/index.ts

+export * from './person.model';

src/app/models/person.model.ts

+export class PersonModel {
+  public id: number;
+  public lastname: string;
+  public firstname: string;
+  public email: string;
+  public gender: GenderEnum;
+  public image: string;
+
+  get fullName(): string {
+    return `${this.firstname} ${this.lastname}`;
+  }
+}
+
+export enum GenderEnum {
+  MALE,
+  FEMALE
+}