如何使表行在Angular 2中表现为超链接
如何使表行在Angular 2中表现为超链接
提问于 2018-08-07 01:14:59
我有一个表行，当单击它时，会将用户带到一个新页面：
<tr routerLink="/users/{{user.id}}">
<!-- ... a bunch of cells with user name, etc -->
</tr>这很好用，但由于它不是真正的HTML链接，它的行为并不完全像浏览器中的链接(例如，没有在新选项卡中打开链接的选项)。
我尝试将每个<td>元素包装在<a>中，并使用CSS删除链接样式，它的行为类似于链接，但仅当鼠标位于表单元格中的文本上时。
有没有其他方法可以让表行表现得更像一个超链接？
回答 2
Stack Overflow用户
发布于 2018-08-07 02:54:55
试着这样做。
你必须传递数组参数才能创建动态路由URL，你的情况在静态URL中工作得很好。请参考"https://angular.io/api/router/RouterLink“
<tbody>
<tr routerLink="[/user, user.id]">
<td>John</td>
<td>Doe</td>
<td>john.doe@abc.com</td>
</tr>
</tbody>Stack Overflow用户
发布于 2018-08-07 01:22:38
试试这样的东西。在click function中，编写重定向逻辑。
<tbody>
<tr *ngFor="let car of pagedItems" (click)="editCar(car)">
<th>{{ car.car_id }}</th>
<td>{{ car.car_maker }}</td>
<td>{{ car.car_model }}</td>
<td>{{ car.car_year }}</td>
<td><i class="material-icons" style="color:red" (click)="$event.stopPropagation();deleteCar(car.car_id)">delete_forever</i></td>
</tr>
</tbody>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51712639
复制相关文章
相似问题
腾讯云开发者
