Как определить, какой родительский компонент макета в настоящее время активен в Angular в app.component? - PullRequest
1 голос
/ 03 мая 2020

Как проверить, какой компонент макета в данный момент активен в Angular в app.component?

Вот пример моего app-routing.module.ts.

{
        path: '',
        component: FrontComponent,
        children: [
            {
                path: '',
                redirectTo: 'login',
                pathMatch: 'full'
            },
            {
                path: 'login',
                component: LoginComponent
            }
        ]
    },

    {
        path: '',
        component: MainComponent,
        canActivate: [AuthGuard],
        children: [
            {
                path: 'dashboard',
                component: DashboardComponent
            },
            {
                path: 'message-list',
                component: MessageListComponent,
            }
        ]
    }

Теперь я хочу проверить компонент макета в app.component, например, « FrontComponent » или « MainComponent ». Потому что я хочу выполнить некоторые действия на основе компонента макета. Я искал другие вопросы, но не смог получить требуемый ответ. Может кто-нибудь, пожалуйста, помогите мне? Заранее спасибо. Особенно важно проверить, что макет frontcomponent активен в app.component.ts

Ответы [ 2 ]

0 голосов
/ 03 мая 2020

Вы можете узнать это, посмотрев на URL с

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
    template: ''
})
export class Component {

    constructor(private router: Router) {}

    ngOnInit() {
        if ( this.router.url.indexOf('login') != -1) {
          console.log('Father is FrontComponent');
       }
    }
}

0 голосов
/ 03 мая 2020

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...