title: Angular: set specific routing link active when on child route
body: <p>I have a set of routes:</p>
  
  <pre><code>{
    path: 'user-management',
    component: UserManagementComponent,
  },
  {
    path: 'user-management/profile',
    component: UserProfileManagementComponent
  },
  {
    path: 'user-management/groups',
    component: UserGroupManagementComponent
  },
  {
    path: 'user-management/permissions',
    component: PermissionsManagementComponent
  },
  </code></pre>
  
  <p>and a set of links:</p>
  
  <pre><code>&lt;div class="row p-section-sub-menu-outer-row-border"&gt;
    &lt;div class="col-xs-4 col-sm-4 p-section-sub-menu"
         routerLink="/user-management/groups"
         [routerLinkActiveOptions]="{exact:true}"
         routerLinkActive="p-section-sub-menu-selected"&gt;
      {{'USER_MANAGEMENT.MANAGE_USER_GROUPS' | translate}}
    &lt;/div&gt;
    &lt;div class="col-xs-4 col-sm-4 p-section-sub-menu"
         routerLink="/user-management"
         [routerLinkActiveOptions]="{exact:true}"
         routerLinkActive="p-section-sub-menu-selected"&gt;
      {{'USER_MANAGEMENT.USER_MANAGEMENT' | translate}}
    &lt;/div&gt;
    &lt;div class="col-xs-4 col-sm-4 p-section-sub-menu"
         routerLink="/user-management/permissions"
         [routerLinkActiveOptions]="{exact:true}"
         routerLinkActive="p-section-sub-menu-selected"&gt;
      {{'USER_MANAGEMENT.MANAGE_USER_PERMISSIONS' | translate}}
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is that the <code>UserProfileManagementComponent</code> when active doesn't highlight the <code>UserManagementComponent</code> link because of the <code>routerLinkActiveOptions</code>.</p>
  
  <p>Is there a way to force it to be active somehow?</p>