Блог

В моем приложении я хочу загружать контекстно-зависимые тексты справки, поэтому тексты основаны на текущем местоположении приложения. Однако, когда посетитель находится в местоположении с параметром id, не следует загружать отдельный текст справки для каждого идентификатора, а только общую версию. Я считаю, что нераспределенный путь лучше всего подходит для этой цели.

Некоторый код для очистки:

Текущий маршрут: /page/1 преобразуется в компонент страницы:

 {path: '/page/:pageid', component: PageComponent}
  

Я хочу показать текст справки для этого компонента страницы. Итак, для восстановления текста справки я хочу иметь нераспределенный путь (/page/:pageid) в качестве переменной.

На данный момент я использую RC4, но все направления к решению приветствуются.

Редактировать: кажется, что обычно приведенный ниже код должен работать

 constructor(public route: ActivatedRoute) {}

ngOnInit(): void {
    setTimeout(() => {
        console.log(this.route.snapshot._routeConfig.path);
    });
}
  

Однако на самом деле данный маршрут является дочерним маршрутом:

 {
    path: 'app',
    component: Core,
    children: [
       {path: 'page/:pageid', component: PageComponent}
    ]
}
  

В результате появляется «приложение» в консоли.

Редактировать 2: закрыть, но еще не завершить работу…

 ngOnInit(): void {
    setTimeout(() => {
        let state = this.router.routerState;
        console.log(state.firstChild(state.firstChild(state.root)).toString());
    });
}
  

Приводит к:

 Route(url:'page/1', path:'page/:pageid')
  

Может быть, вы можете сделать это таким образом:

1. Импортируйте маршруты
2. Подпишитесь на router.events, чтобы получить URL-адрес (doc)
3. При изменении URL-адреса выполните цикл по пути маршрутов, посмотрите, соответствует ли шаблон URL-адресу

После еще некоторого изучения основных файлов js я пришел к следующему решению:

 ngOnInit(): void {
    setTimeout(() => {
        const state = this.router.routerState;
        this.url = state.firstChild(state.firstChild(state.root)).snapshot._routeConfig.path;
    });
}
  

Копание было в @angular/router/src/router_state.js:

 RouterState.prototype.toString = function () { return this.snapshot.toString(); };

...

ActivatedRouteSnapshot.prototype.toString = function () {
    var url = this.url.map(function (s) { return s.toString(); }).join('/');
    var matched = this._routeConfig ? this._routeConfig.path : '';
    return "Route(url:'"   url   "', path:'"   matched   "')";
};
  

Это дало мне достаточно информации для вышеупомянутого решения.