NullInjectorError: Нет поставщика для магазина! AUTH GUARD Angular 9 - PullRequest
0 голосов
/ 14 марта 2020

Я пытаюсь разработать Auth Guard с помощью Angular 9, но когда я пытаюсь внедрить его в компонент в консоли браузера, выдается сообщение об ошибке:

Ошибка: Uncaught (в Обещание): NullInjectorError: R3InjectorError (SampleModule) [AuthGuard -> Магазин -> Магазин -> Магазин -> Магазин]: NullInjectorError: Нет поставщика для Магазина! NullInjectorError: R3InjectorError (SampleModule) [AuthGuard -> Магазин -> Магазин -> Магазин -> Магазин]: NullInjectorError: Нет провайдера для магазина! на NullInjector.get (core. js: 1050) на R3Injector.get (core. js: 16521) на R3Injector.get (core. js: 16521) на R3Injector.get (core. js: 16521) в NgModuleRef $ 1.get (core. js: 35539) в R3Injector.get (core. js: 16521) в injectInjectorOnly (core. js: 905) в Module.ɵɵinject (core. js : 915) в Object.AuthGuard_Factory [как фабрика] (auth.guard.ts: 17) в R3Injector.hydrate (ядро. js: 16747) в resolPromise (zone-evergreen. js: 793) в resolPromise (зона -evergreen. js: 752) в зоне вечнозеленых. js: 854 в ZoneDelegate.invokeTask (зона-вечнозеленых. js: 400) в Object.onInvokeTask (ядро. js: 40744) в ZoneDelegate. invokeTask (zone-evergreen. js: 399) в Zone.runTask (zone-evergreen. js: 168) в канале MicroTaskQueue (zone-evergreen. js: 570)

Вот Страж:

import {
  CanActivate,
  CanActivateChild,
  ActivatedRouteSnapshot,
  RouterStateSnapshot
} from '@angular/router'
import { Store } from '@ngrx/store'
import { AppState } from '../auth.store/states/app.state'
import { AuthService } from '../auth.services/auth.services'
import { AuthActions } from '../auth.store/actions/auth.actions'

@Injectable({
    providedIn: 'root'
})

export class AuthGuard implements CanActivate, CanActivateChild {
  constructor(private store$: Store<AppState>,
              private authService: AuthService) {
  }

Это мой пример модуля

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';

import { SampleComponent } from './sample.component';
import { AuthGuard } from 'app/auth.app/auth.guards/auth.guard';

const routes = [
    {
        path     : 'sample',
        component: SampleComponent,
        canActivate : [AuthGuard]
    }
];

@NgModule({
    declarations: [
        SampleComponent
    ],
    imports     : [
        RouterModule.forChild(routes),

        TranslateModule,
    ],

    providers:[
        AuthGuard
    ],

    exports     : [
        SampleComponent
    ]
})

export class SampleModule
{
}

А это мой модуль приложения

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router';
import { MatMomentDateModule } from '@angular/material-moment-adapter';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { TranslateModule } from '@ngx-translate/core';
import 'hammerjs';
import { AppComponent } from 'app/app.component';
import { LayoutModule } from 'app/layout/layout.module';

const appRoutes: Routes = [
    {
        path        : '',
        loadChildren: () => import('./auth.app/auth.module').then(m => m.AuthModule)
    },    
    {
        path        : '',
        loadChildren: () => import('./main/sample/sample.module').then(m => m.SampleModule)
    }
];

@NgModule({
    declarations: [
        AppComponent,
    ],
    imports     : [
        BrowserModule,
        BrowserAnimationsModule,
        HttpClientModule,
        RouterModule.forRoot(appRoutes),

        TranslateModule.forRoot(),

        // Material moment date module
        MatMomentDateModule,

        // Material
        MatButtonModule,
        MatIconModule,

        // App modules
        LayoutModule,
        // SampleModule,
    ],
    bootstrap   : [
        AppComponent
    ]
})
export class AppModule
{
}

1 Ответ

1 голос
/ 15 марта 2020

Вам нужно будет добавить магазин к импорту:

imports: [
 StoreModule.forRoot(...)
]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...