Couldn't get rid of the error in canActivate

Question

Searched all the old questions from stackoverflow regarding this but Couldn't get rid of this error.. Anyone pls look at my code and give me the solution

Error : "canActivate in type AuthGuard is not assignable to same property in base type CanActivate"

Authgurad.service.ts

import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from "@angular/router";
import { Observable } from "rxjs";
import { Injectable } from '@angular/core';
import { AuthService } from './auth-service';
import { Router } from '@angular/router';


@Injectable()
export class AuthGuard implements CanActivate {
  authenticated!: boolean;
  constructor(private auth: AuthService, private router: Router) { }
  canActivate(route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot): Observable<boolean | undefined> | Promise<boolean | undefined> | boolean | undefined {
    return this.auth.isAuthenticated()
      .then(
        (authenticated) => {
          if (authenticated) {
            return true;
          }
          else {
            //this.router.navigate(['/']);
            return false;
          }
        }
      );
  }


}

Thanks in advance

Answer 1

Change your code to:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {}