时间戳

首页 > 解决方案 > 动态 routeLink 无法显示 URL

javascript - 动态 routeLink 无法显示 URL

问题描述

在此处输入图像描述

<table class="table">
    <thead>
        <tr>
            <th>Title</th>
            <th>Price</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr *ngFor= "let p of  products$ | async ">
            <td>{{p.title}}</td>
            <td>{{p.price}}</td>
            <td>
                <a [routerLink] = "['/admin/products/', p.key]" >Edit</a>
            </td>
        </tr>
    </tbody>
</table>


{
    path: 'admin/products',
    component: AdminProductsComponent,
    canActivate: [AuthGuard, AdminAuthGuard]
  },
  {
    path: 'admin/products/new',
    component: ProductFormComponent,
    canActivate: [AuthGuard, AdminAuthGuard]
  },
  {
    **path: 'admin/products/:id',**
    component: ProductFormComponent,
    canActivate: [AuthGuard, AdminAuthGuard]
  },

你好朋友！

您可以在图片中看到下面的蓝色单词“编辑”。我希望它显示 amdin/product + 'URl' ，但结果是 admin/product/undefined。

而且我在上面给出了我为此功能目的编写的代码，我的问题在哪里？？？？

此外，我在 cmd 和 chrome 控制台中都没有遇到任何兼容错误。

问候！

标签： javascriptangularrxjsangular-cli

解决方案

在您使用的编辑链接中p.key，如下所示，

 <a [routerLink] = "['/admin/products/', p.key]" >Edit</a>

但是在产品数组中，您没有获得该数组对象中的key字段。product所以p.key将是未定义的

推荐阅读