Angular如何设置routerLink

Question

我的应用程序中有很多表格行。有些是链接，有些则不是。这是一个示例：

<tr [routerLink]="['/invoices', invoice?.invoice.id || 0, 'sms']">

我想用routerLink样式所有tr，像这样：

tr[routerLink] {
   cursor: pointer;
}

但是它不起作用。什么是正确的CSS？谢谢

Answer 1

使用已编译的属性ng-reflect-router-link：readfile()

a[ng-reflect-router-link] {
  color: red;
  font-weight: 700;
}

tr[ng-reflect-router-link] {
  cursor: pointer;
}

Answer 2

html：

<a [routerLink]='link' [ngClass]="{'router-link-active': true">{{name}}</a>

css：

.router-link-active {
   cursor: pointer;
}

Answer 3

在您的情况下，由于“ []” 而引起的问题

因此，如果您想确定哪个是链接，哪些不是，请尝试下面的代码

这是例子

<tr [routerLink]="['/invoices', invoice?.invoice.id || 0, 'sms']" routerLinkActive="active>

和style.css

中

tr[routerLinkActive] {
    color: red;
 }

这是Stackblitz演示

此样式仅适用于那些链接