Angular2 @ angular / router 3.0.0-alpha.3 - Как получить имя или путь к маршруту при изменении маршрута

Я пытаюсь получить текущее имя или путь к маршруту в моем app.component при изменении маршрута, чтобы я мог использовать имя маршрута в качестве класса страницы вокруг div-оболочки. Я пытаюсь найти лучший способ справиться с этим. Ранее я подписывался на свойство изменений маршрутизатора, как я перечислил ниже, но кажется, что оно больше не доступно с @ angular / router 3.0.0-alpha.3. Если у кого-то есть какие-либо мысли или предложения, я был бы очень признателен.

this.router.changes.subscribe((val) => {
  var path = this._location.path();
  if (path.indexOf('page-name') !== -1) {
    this.pageClass = 'page-name';
  }
})
 rtn19 июн. 2016 г., 01:01
Имея ту же проблему. Если вы нашли решение, вы можете опубликовать его?
 orion58318 июн. 2016 г., 23:36
если бы я мог получить путь к маршрутизатору каждый раз, когда меняется маршрут, это тоже будет работать.
 Günter Zöchbauer18 июн. 2016 г., 21:02
В этом маршрутизаторе нет имен маршрутов (только путь)

Ответы на вопрос(2)

Ответ Стива - тот, который задокументирован в настоящее время, но URL, наблюдаемый наActivatedRoute не запускается для меня, за исключением случаев, когда я впервые нажимаю на базовый URL (например, работает переход от / index к / index / item, но переход от / index / item к index / item / 2, index / dashboard или даже / index делает не).

Я не уверен, является ли следующее решение наилучшей практикой, и каковы последствия для производительности, но я смог получить активный маршрут наNavigationEnd Событие роутера со следующим:

import { Component, OnInit, OnDestroy } from '@angular/core';
import { ROUTER_DIRECTIVES, Router, NavigationEnd } from '@angular/router';

@Component({
    selector: 'navbar',
    directives: [ROUTER_DIRECTIVES], 
    template: `
                ...
              `    
})

export class NavBarComponent implements OnInit, OnDestroy {
    private sub: any;

    constructor(private router: Router) {
    }

    ngOnInit() {
        this.sub = this.router.events.subscribe(e => {
            if (e instanceof NavigationEnd) {
                console.log(e.url);
            } 
        });
    }


    ngOnDestroy() {
        this.sub.unsubscribe();
    }
}

Это срабатывает каждый раз, когда вы меняете маршрут, независимо от того, насколько глубоко вы находитесь в дереве URL или где вы перемещаетесь в / из.

 Biggie05 нояб. 2016 г., 12:40
+1: у меня была похожая проблема. Наблюдаемое изActivatedRoute не стрелял при навигации по приложению. НоRouterLinkActive Директива правильно изменила классы ссылок в соответствии с текущим маршрутом.RouterLinkActive использует тот же подход, что и в этом ответе: прислушиваясь кNavigationEnd событие.

вероятно, поможет,

import { CanActivate, Router, RouterStateSnapshot } from '@angular/router';

@Component({
  selector: 'my-component',
  templateUrl: 'my-component.html'
})
export class MyComponent implements CanActivate {
  constructor(private router: Router) {}

  canActivate(state: RouterStateSnapshot) {
   // this is the future route you are intended to visit
   console.log(state.url);
  }
}

Более подробная информация наhttps://angular.io/docs/ts/latest/guide/router.html

 codef0rmer07 сент. 2016 г., 07:51
@ LukeDupin Да, я тоже. Каждый RC был похож на другую версию. Под RC6 подразумевается Angular 6 ;-)
 codef0rmer11 сент. 2016 г., 17:25
@ LukeDupin Я обновил код в соответствии с RC6 :-)
 orion58320 июн. 2016 г., 17:44
@Maxime правильно, и RouteSegment и OnActive больше не доступны в v3. Я получаю следующие ошибки, когда пытаюсь их включить. @ angular / router / index "'не имеет экспортируемого mng' RouteSegment '. @ angular / router / index"' не имеет экспортируемого mng 'OnActivate'
 Maxime20 июн. 2016 г., 13:29
Интерфейс OnActivate больше не существует с маршрутизатором v3, поэтому я не думаю, что он будет работать. И, кстати, класса RouteSegment тоже нет.
 Luke Dupin06 сент. 2016 г., 04:45
Та же проблема, RouteSegment исчез. Что мы должны использовать сейчас ??? Я ненавижу эти огромные "RC" изменения.
 Luke Dupin09 сент. 2016 г., 19:22
@ codef0rmer Без шуток! Это заставляет меня смотреть на ReactJS каждый раз, когда я обновляюсь, но потом я возвращаюсь к Angular6.

Ваш ответ на вопрос