时间戳

首页 > 解决方案 > RouterLink 在路由上附加对象信息

angular - RouterLink 在路由上附加对象信息

问题描述

我是一个有角度的初学者，我正试图用它RouterLink来生成一个链接

这是路线：

{ path: 'heroe/:id', component: HeroeComponent},

这是html

<h1>Heroes <small>de Marvel y DC</small></h1>
<div class="card-columns">
    <div class="card animated fadeIn fast" *ngFor="let heroe of heroes; let i of index">
        <img [src]="heroe.img" class="card-img-top" [alt]="heroe.nombre">
        <div class="card-body">
            <h5 class="card-title">{{ heroe.nombre }}</h5>
            <p class="card-text">{{ heroe.bio }}</p>
            <p class="card-text"><small class="text-muted">{{ heroe.aparicion }}</small></p>
            <!--<button class="btn btn-outline-primary btn-block">
                Ver más...
            </button>-->
            <a [routerLink]="['/heroe',i]" class="btn btn-outline-primary btn-block">Ver más...</a>
        </div>
    </div>
</div>

但是它创建了一个路由，将所有heroe对象附加在 url 上，例如：

http://localhost:4200/heroe;nombre=Aquaman;bio=El%20poder%20m%C3%A1s%20reconocido%20de%20Aquaman%20es%20la%20capacidad%20telep%C3%A1tica%20para%20comunicarse%20con%20la%20vida%20marina,%20la%20cual%20puede%20convocar%20a%20grandes%20distancias.;img=assets%2Fimg%2Faquaman.png;aparicion=1941-11-01;casa=DC

标签： angular

解决方案

推荐阅读