小编Oma*_*ejo的帖子

当使用CSS routerLink并将routerLinkActiveCSS应用于导航栏时,我还想包含这些fragment信息,以便链接对于主页中的部分是唯一的.

我已经尝试过[routerLinkActiveOptions]="{ exact: true }"运气了.

导航条形码的相关部分是:

  <li routerLinkActive="active"
      [routerLinkActiveOptions]="{ exact: true }">
    <a routerLink="/sitio" fragment="inicio">Inicio</a>
  </li>
  <li routerLinkActive="active"
      [routerLinkActiveOptions]="{ exact: true }">
    <a routerLink="/sitio" fragment="invierte">Invierte</a>
  </li>
  <li routerLinkActive="active"
      [routerLinkActiveOptions]="{ exact: true }">
    <a routerLink="/sitio" fragment="contacto">Contacto</a>
  </li>

上述代码访问的三个不同的URL是:

• /sitio#inicio
• /sitio#invierte
• /sitio#contacto

但是当点击其中任何一个时,所有这些都被标记为活动(因为它们对应于routerLink="/sitio"并且fragment=*信息不包括在检查中.这导致导航栏在单击其中任何一个时看起来像这样:

关于如何做到这一点的任何想法？

我一直在使用Angular 2文档中的Heroes教程进行实验.但是,我已经明白我不明白这个错误发生了什么:

Uncaught (in promise): TypeError: Cannot read property 'query' of null在browser_adapter.ts:88.

涉及的两件是HeroDetailComponent和HeroService.

import { Component, OnInit } from '@angular/core'; 
import { RouteParams } from '@angular/router-deprecated';

import { Hero, HeroService } from '../index';

@Component({
    selector: 'my-hero-detail',
    templateUrl: ...
    styleUrls: [...]
})
export class HeroDetailComponent implements OnInit {

    hero: Hero;

    // TEMPORARY FIX:
    _heroService = new HeroService();  // Avoids injection

    // constructor(private _heroService: HeroService,
    //             private _routeParams: RouteParams) {}

    constructor(private _routeParams: RouteParams) {}

    ngOnInit() …