
<mat-card>
    <mat-card-header>
        <mat-card-title> {{ heroe.superhero }} </mat-card-title>
        <mat-card-subtitle> {{ heroe.alter_ego }} </mat-card-subtitle>
    </mat-card-header>

    <img mat-card-image [src]="heroe | imagen">

    <mat-card-content>
        <h3>{{ heroe.publisher }}</h3>
        <p>
            <strong>Primera aparición</strong> {{ heroe.first_appearance }}
            <br>
            <strong> Personajes: </strong> {{ heroe.characters }}
        </p>
    </mat-card-content>

    <mat-card-actions>
        <button mat-button 
                color="warn"
                [routerLink]="['/heroes', heroe.id ]">
            Leer más...
        </button>

        <button mat-button 
                color="info"
                [routerLink]="['/heroes/editar', heroe.id ]">
            Editar
        </button>
    </mat-card-actions>

</mat-card>
