首页 文章

在网格列表中创建'view'链接，该链接导航到Angular中的详细路线，例如hero /：id

提问于
浏览 次
0

In my template I am doing the following:

<tbody>
  <tr *ngFor="let h of heroes">
    <td>{{ h.id}}</td>
    <td>{{ h.name}}</td>
    <td>{{ h.description}}</td>
    <td><a href="">View</a></td>
  </tr>
</tbody>

我怎样才能这样做View是一个导航到/ heroes /：id的链接？我在路由配置中有这个设置 . 我通过http://localhost:4200/heroes/1验证了它的工作原理

我最好使用（click）事件并调用viewHero（id）等函数 . 如果我这样做，我不确定如何传递id . 此外，如果它可以直接在href标签或routerLink中的html模板内部完成，我想知道如何做到这一点 . 我的主要问题似乎是访问字符串中的h.id，例如href =“” .

Update: 我有以下工作，但仍然不满意：

<td><a (click)="viewHero(h)">View</a></td>

  viewHero(hero) {
    this.router.navigate(['/heroes', hero.id]);
  }

必须有一种方法可以直接在锚标记内部执行此操作 . 在悬停链接时我没有指针 .

javascript angular

1 回答

  • 1

    试试这个：

    <tbody>
  <tr *ngFor="let h of heroes">
    <td>{{ h.id}}</td>
    <td>{{ h.name}}</td>
    <td>{{ h.description}}</td>
    <td><a routerLink="/heroes/{{h.id}}">View</a></td>
  </tr>
</tbody>
    回复于

相关问题