2017-01-10 5 views
1

С помощью Angular2, как бы получить текущий активный компонент и путь?Извлечение активного компонента и пути

Например, я мог бы иметь следующие маршруты:

{ path: '', component: HomeComponent }, 
{ path: 'list', component: ListComponent }, 
{ path: ':id/', component: CustomComponent } 

Если бы я, чтобы перемещаться https://domain.com/test есть способ, чтобы знать, что я в настоящее время просмотра CustomComponent и получить Ид/путь, который в этом случай «тест»?

Я мог бы использовать window.location.pathname с регулярным выражением, чтобы получить путь, но это грязно и по-прежнему не позволяет мне легко получить активный компонент.

+1

Не могли бы вы расширить контекст - в чем проблема, которую вы пытаетесь решить с этим? – jonrsharpe

+0

Несомненно. Мне нужно получить путь для использования с API, но он должен быть, пока пользователь просматривает «CustomComponent», поскольку меня не интересуют другие маршруты маршрутов, такие как «список». Я хочу только пользовательский «id». –

+1

Тогда вы прочитали документы? Это описано в https://angular.io/docs/ts/latest/guide/router.html – jonrsharpe

ответ

0

Yah, угловое руководство 2 стартера охватывает все, что вам нужно вставить ActivatedRoute на ваш компонент, тогда вы можете получить необходимую информацию, подписавшись на параметры маршрута.

Я бы порекомендовал вам сделать угловую экскурсию по героям, это действительно хороший учебный материал, который они предоставили.

Вводят ActivatedRoute, на компоненте конструктора:

constructor(private route: ActivatedRoute) { 
} 

ngOnInit() { 
    this.route.params.subscribe(params => { 
     console.log(params['id']); 
    }); 
    } 
1

Да, вы можете проверить текущий активный компонент с помощью маршрутизатора snapshot-

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

constructor(public route : ActivatedRoute) { 
    var snapshot = route.snapshot; 
    console.log(snapshot._routeConfig.component.name); //This will give you the name of current active component 
    } 

Примечание- snapshot._routeConfig.component.name это будет дайте вам имя активного компонента, и если вы хотите URL-адрес, вы также можете получить его .url вместо имени

1

вы можете enab ле след в вашей конфигурации маршрутизатора для корня {enableTracing: true}, чтобы получить больше идей, как маршруты будут решены и активированные

0

Sure, используя ActivatedRoute модуль, который вы можете получить доступ к параметрам маршрута или привязать к событию параметров cgange

import {ActivatedRoute} from "@angular/router"; 

constructor(private activatedRoute: ActivatedRoute) { 
} 

this.activatedRoute.params.subscribe(params => { 
    console.log(params['id']); 
}); 

Также здесь вы можете также получите доступ к вашему текущему типу компонента, используя

this.activatedRoute.component; 
Смежные вопросы