How to make a table row behave as a hyperlink in Angular 2

I have a table row that, when clicked, takes the user to a new page:

<tr routerLink="/users/{{user.id}}">
<!-- ... a bunch of cells with user name, etc -->
</tr>


That works fine, but as it's not an actual HTML link, it doesn't behave entirely like one in the browser (e.g. there's no option to open the link in a new tab).

I tried wrapping each <td> element in an <a> and removing the link styling with CSS, which behaves like a link but only when the mouse is over the text in the table cell.

Is there another way to get the table row to behave more like a hyperlink?

Continue reading...