如何在 app.component 的 Angular 中检测当前活动的父布局组件？

Question

How to check which layout component currently active in Angular in app.component?

Here Is example my 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,
            }
        ]
    }

Now I want to check layout component in app.component such as if it is ' FrontComponent ' or ' MainComponent '. Because I want to perform some activity based on layout component. I have searched other questions but could not get required answer. can anyone please help me out? Thanks in advance. Specifically looking to check layout frontcomponent is active in app.component.ts

Answer 1

You can make a service where you store the current layout component name string, and this variable gets overridden when switching to the other component.

Answer 2

You can learn it by looking at the URL with

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');
       }
    }
}