Angular2 默认在站点加载时处于活动状态 link

Question

我在每个 link 上使用 angular2 和 angular2 [routerLinkActive] 来设置活动 link。这一切都很好。当用户单击 link 时，路由变为活动状态并且 link 获得 "active" class 注入，我可以相应地设置样式。

但是在路由设置中，我设置了一个默认路由，如下所示：

const routes: Routes = [
{ path: '', redirectTo: 'gettiingstarted', pathMatch: 'full' },

当用户第一次导航到页面时，就页面现在成功加载 "gettingstarted" 组件而言，这是有效的，但不幸的是，路由器 link 没有 "active" class 在此时注入，因此样式不正确。获得活动 class 的唯一方法是实际单击 link。

有谁知道如何让 [routerLinkActive] 机制在页面加载时起作用？

更新这是 link 本身的代码 html：

 <a [routerLink]="['gettingstarted']" [routerLinkActive]="['active']">

Answer 1

将以下内容放入 app.component.ts 文件的构造函数中修复它：

        this.router.navigate(['/gettingstarted']);

不确定这是推荐的解决方案，但针对我的情况进行了修复。

Answer 2

像这样在 routerLinkActiveOptions 中使用 isActive: true

<a routerLinkActive="active-link" [routerLinkActiveOptions]="{ exact: true, isActive: true }">Home</a>

Angular2 default active link on site load