Хорошо, вот предложение, основанное на том, что я вижу из кода.
Ваш navbar, вероятно, вызывается внутри одного из ваших компонентов как дочерний компонент, возможно, так же, как внутри вашего perfil.component.html.
<navbar [parameters...]></navbar>
Я не уверен на 100% в этом, но я предполагаю, что инъекция ActivatedRoute работает только для компонентов, которые были загружены через прямую связь с маршрутизатором, а не для дочерних модулей (я действительно не уверен в этом) , Это будет означать, что AcitvatedRoute работает для perfil.component, но не для navbar.component (потому что не вызывается с вашего маршрутизатора). Однако если ваша навигационная панель вызывается так, как показано выше, вы можете отправить переменную lang из perfil.component на навигационную панель в качестве входного параметра.
Вот это perfil.component.html:
<navbar [lang]="lang"></navbar>
Вот это navbar.component.ts:
// the lang string is now an input parameter
@Input() lang: string;
constructor(private translate: TranslateService, private router: Router) {
...
// the default language should already been set in the parent component
// NO NEED: translate.setDefaultLang('en');
}
// the input parameter are not yet availbable in the constructor, but on init
ngOnInit(){
this.translate.use(lang);
console.log(lang);
}
Надеюсь, это поможет.
EDIT
Увидев вашу команду, я вижу, что у меня не так с навигацией. Ваш компонент navbar вызывается первым, так сказать, родительским компонентом, который создается до инициализации потомков.
Проблема в том, что у navbar есть свой текущий маршрут. То, что вы пытаетесь сделать, это получить доступ к дочернему маршруту в родительском компоненте. Я нашел похожий вопрос здесь с принятым ответом, который, кажется, больше не работает. Вы можете проверить это при необходимости, есть другое решение, хотя это выглядит сложно. Так что я не уверен, что это путь.
Предложение по улучшению
Проблема, которую я вижу, заключается в самом подходе с языком в качестве параметра маршрутизации для дочерних компонентов, а не для parent . Язык в настоящее время является параметром маршрута, который устанавливается на каждом дочернем маршруте панели навигации, что приводит к большому повторению в вашем коде. В любом случае, все дети обязательно должны пройти процесс инициализации navbar, так почему бы не поработать над языком? Таким образом, вам нужно только выполнить языковую загрузку в одном месте вашего кода.
В этом случае вам, вероятно, придется настроить роутер, что-то вроде этого.
{ path: '', redirectTo: '/login', pathMatch: 'full' },
{ path: ':lang', component: NavbarComponent, children: [
{path: 'agenda', component: AgendaComponent},
{path: 'perfil', component: PerfilComponent},
{path: 'servicos', component: CadastroServicoComponent},
{path: 'profissionais', component: ProfissionaisComponent},
{path: 'admin', component: AdminComponent},
{path: 'dashboard', component: DashboardComponent},
{path: 'signup', component: SignUpFormComponent}
]}
Также код, который в данный момент не работает, просто больше не нужен, потому что вам больше не нужно указывать язык для дочерних маршрутов.
<header id="topnav">
<ul class="navbar-nav" *ngFor="let p of perfil | async">
<li class="nav-item">
<!-- without / the router routes to children relative to the current path -->
<!-- no need for the language anymore -->
<a [routerLink]="['agenda']" class="nav-link" translate>Agenda</a>
</li>
<li class="nav-item">
<a [routerLink]="['admin']" class="nav-link" translate>Admin</a>
</li>
...
</ul>
</header>
Со своей страницы входа вы направляетесь прямо на страницу /lang (которая является панелью навигации), а затем инициализируете там язык (и делаете это только один раз). Все дочерние компоненты теперь являются дочерними для маршрута lang вместо того, чтобы иметь собственный параметр lang. В navbar.component.ts вы, вероятно, можете использовать тот же код, который вы используете в настоящее время. А в дочерних компонентах больше не инициализируйте ngx-translate, теперь он централизован в родительском компоненте. Если вы хотите использовать языковой параметр в одном из дочерних компонентов, вы все равно можете получить доступ к текущему маршруту там, потому что параметр все еще является частью маршрута, он просто расположен немного левее.
Надеюсь, это достаточно точно.