Difference between CanActivate and CanActivateChild

This particular blog teaches difference between CanActivate and CanActivateChild. CanActivate will trigger when root url is change. In this example when route is change from Product => Admin or Admin => Product, CanActivate will trigger in side AuthGuard. but, when route change from Admin/Profile -> Admin/Setting, CanActivate will not work. At that time we need to use CanActivateChild

<a [routerLink]="['']">Product | </a>
<a [routerLink]="['/admin']"> Admin</a>
<router-outlet></router-outlet>

import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { Observable } from 'rxjs';

@Injectable()
export class AuthGuard implements CanActivate {
  canActivate(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    alert("Auth Guard");
    return true;
  }

  canActivateChild(
    next: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    alert("Auth Guard Child Method");
    return true;
  }

  

  constructor() {

  }
}