Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

angular typeof guard error while compiling

im starting a new angular project, but getting the following error:

ERROR in src/app/app-routing.module.ts(11,5): error TS2740: Type 'typeof LoginGuard' is missing the following properties from type 'any[]': pop, push, concat, join, and 25 more.

what does typeof loginGuard acually mean, and what do I need to do to make it work as it's intended to?

Here is my route file:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from "./login/login.component";
import { LoginlandingComponent} from "./loginlanding/loginlanding.component";
import { LoginGuard} from "./login.guard";

const routes: Routes = [
  { path: 'login', component: LoginComponent },
  {
    path: '',
    canActivateChild: LoginGuard,
    children: [
      {
        path: 'home',
        component: LoginlandingComponent
      }
    ]
  }

];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

Here is my guard file:

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

@Injectable({
  providedIn: 'root'
})
export class LoginGuard implements  CanActivate  {

  constructor(private _router: Router) {
  }

  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    if (false) {
      console.log("its true");
      return true;
    }
  console.log("redirecting");
    // navigate to login page
    this._router.navigate(['/login']);
    return false;
  }


}
like image 679
maria Avatar asked Dec 24 '22 00:12

maria


1 Answers

canActivateChid should be an array value. Change the route definition to:

{
    path: '',
    canActivateChild: [LoginGuard],
    children: [
      {
        path: 'home',
        component: LoginlandingComponent
      }
    ]
  }

Note also that you are implementing the wrong interface. If you want to use that guard for child routes, you need to implement CanActivateChild

like image 120
Jota.Toledo Avatar answered Dec 25 '22 23:12

Jota.Toledo