javascript - angular typeof guard error while compiling - Stack Overflow

admin管理员组

文章数量:1394062

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/loginponent";
import { LoginlandingComponent} from "./loginlanding/loginlandingponent";
import { LoginGuard} from "./login.guard";

const routes: Routes = [
  { path: 'login', ponent: LoginComponent },
  {
    path: '',
    canActivateChild: LoginGuard,
    children: [
      {
        path: 'home',
        ponent: 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;
  }


}

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.ponent";
import { LoginlandingComponent} from "./loginlanding/loginlanding.ponent";
import { LoginGuard} from "./login.guard";

const routes: Routes = [
  { path: 'login', ponent: LoginComponent },
  {
    path: '',
    canActivateChild: LoginGuard,
    children: [
      {
        path: 'home',
        ponent: 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;
  }


}

• javascript
• angular

Share Improve this question Follow edited Mar 7, 2019 at 10:01 Lloyd 1,1291111 silver badges3232 bronze badges asked Mar 7, 2019 at 9:54 mariamaria 15955 gold badges2424 silver badges6262 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

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

{
    path: '',
    canActivateChild: [LoginGuard],
    children: [
      {
        path: 'home',
        ponent: 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

本文标签： javascriptangular typeof guard error while compilingStack Overflow