1

在实施 CanActivate Guard 时出现错误：没有 HRComponent 的提供者

import { Component, OnInit } from "@angular/core"
import { ActivatedRoute, CanActivate } from "@angular/router"
import { LoginService } from "../../services/loginservice"
@Component({
    templateUrl:"../../../templates/hrmodule/hrmodule.html"
})
export class HRComponent implements CanActivate {
    constructor(private Loginservice: LoginService) { }
    canActivate(){
        debugger;
        alert('Active');
        return true;
    }
}

这是我的 HRmodile.ts

import { NgModule } from "@angular/core"
import { RouterModule} from "@angular/router"
import { HrRoute } from "../../app/route/hrroute"
import { HRComponent } from "../../app/component/hrcomponent/hrcomponent"
import { LoginService } from "../../app/services/loginservice"
@NgModule({
    imports: [RouterModule.forChild(HrRoute)],
    declarations: [HRComponent],
    bootstrap: [HRComponent ],
    providers: [LoginService]
})

export class HRmodule {
}

这是 HrRoute 我在这里写了 canActivate

import { HRComponent } from "../component/hrcomponent/hrcomponent"
export const HrRoute = [
    { path: "Add", component: HRComponent, canActivate: [HRComponent]}
];

这是我的 HTML 链接

    <a [routerLink]="['HrModule/Add']" class="btn btn-primary btn-sm">HrModule</a>

{ path: 'HrModule', loadChildren: '../../module/hrmodule/hrmodule#HRmodule' },
4

1 回答 1

0

守卫必须是服务而不是组件。

@Injectable()
export class HRService implements CanActivate {
    constructor(private Loginservice: LoginService) { }
    canActivate(){
        debugger;
        alert('Active');
        return true;
    }
}

请注意，它不能成为模块中的引导组件。按照惯例，引导组件是“AppComponent”

@NgModule({
    imports: [RouterModule.forChild(HrRoute)],
    bootstrap: [ @@@ YOU NEED SOMETHING ELSE HERE @@@ ],
    providers: [LoginService, HRService ]
})
export class HRmodule {
}

有关更多信息和示例，请参阅此处的文档：https ://angular.io/api/router/CanActivate

在这里：https ://angular.io/guide/router#milestone-5-route-guards

于 2017-08-20T06:20:46.300 回答