angular - While Implementing CanActivate Guard Error as : No provider for HRComponent -
while implementing canactivate guard im getting error : no provider hrcomponent
import { component, oninit } "@angular/core" import { activatedroute, canactivate } "@angular/router" import { loginservice } "../../services/loginservice" @component({ templateurl:"../../../templates/hrmodule/hrmodule.html" }) export class hrcomponent implements canactivate { constructor(private loginservice: loginservice) { } canactivate(){ debugger; alert('active'); return true; } }
this hrmodile.ts
import { ngmodule } "@angular/core" import { routermodule} "@angular/router" import { hrroute } "../../app/route/hrroute" import { hrcomponent } "../../app/component/hrcomponent/hrcomponent" import { loginservice } "../../app/services/loginservice" @ngmodule({ imports: [routermodule.forchild(hrroute)], declarations: [hrcomponent], bootstrap: [hrcomponent ], providers: [loginservice] }) export class hrmodule { }
this hrroute here wrote canactivate
import { hrcomponent } "../component/hrcomponent/hrcomponent" export const hrroute = [ { path: "add", component: hrcomponent, canactivate: [hrcomponent]} ];
this html link
<a [routerlink]="['hrmodule/add']" class="btn btn-primary btn-sm">hrmodule</a> { path: 'hrmodule', loadchildren: '../../module/hrmodule/hrmodule#hrmodule' },
a guard must service not component.
@injectable() export class hrservice implements canactivate { constructor(private loginservice: loginservice) { } canactivate(){ debugger; alert('active'); return true; } }
and note cannot bootstrapped component in module. convention bootstrapped component "appcomponent"
@ngmodule({ imports: [routermodule.forchild(hrroute)], bootstrap: [ @@@ need else here @@@ ], providers: [loginservice, hrservice ] }) export class hrmodule { }
see docs here more information , example: https://angular.io/api/router/canactivate
and here: https://angular.io/guide/router#milestone-5-route-guards
Comments
Post a Comment