routerlinkactive - 他のページで routerlink をアクティブに設定する

Question

他のページに移動してもサイドバーのオプションを強調表示したい【routerlinkactive状態】にしたいです。だから私はホームコンポーネントに表示されるサイドメニューコンポーネントを持っています

sidemenu コンポーネント html ファイル

<div class="bg-primary sidebar">
<ul class="nav-sidebar"> 
    <li class="sidemenu-item" routerLinkActive="active">
        <a routerLink="/maincontent/first">
            <md-icon>first</md-icon><span>Sidemenu-item-1</span>
        </a>
    </li>
</ul>
<div>

ホーム コンポーネント html ファイル

<sidemenu></sidemenu>
<router-outlet></router-outlet>

ルートファイル

export const ROUTES: Routes = [
  {
    path: 'home',
    component: HomeComponent,
        children: [
        { path: 'first', component : FirstComponent }
        { path: ':id' , component : SecondCompnent}
   ]
  }
 ];

デフォルトでは、最初のコンポーネントにいるときに Sidemenu-item-1 が強調表示されますが、最初のコンポーネントを置き換えて 2 番目のコンポーネントに移動しても、routerlink のアクティブな状態を同じにしたいと考えています。何か案は？