无提供者的 Angular 服务注入错误

如何解决无提供者的 Angular 服务注入错误

我有一个使用路由的 Angular 应用 (v10.1)。

简而言之，我使用模块来利用延迟加载基本目录结构如下

ROOT
    /modules
        /myMod
            myMod.component.ts

myMod 组件需要使用一些服务，所以我试图包含服务 (location.service) 并在构造函数中声明它。

出现错误

core.js:4352 ERROR Error: Uncaught (in promise): 
    NullInjectorError: R3InjectorError(myModModule)[LocationService -> LocationService -> LocationService -> LocationService -> LocationService]: 
    NullInjectorError: No provider for LocationService!

我尝试将此服务添加到@NgModule 中的提供者数组中但我有 3 个模块需要考虑 ROOT、Resource、myMod

我已经尝试将服务分别添加到这些服务中，但无济于事 - 仍然出现错误

这是应用程序的更详细的图表请不要告诉我我需要为每个模组添加服务，如果我误用了模块，请有人解释一下。谢谢

ROOT
-app.module
-app-routing.module
-app.component.html (has link routerLink="/resources/myMod" )

-- modules/resources
----resources-routing.module.ts
        const routes: Routes = [{
                path: 'myMod',loadChildren: () => import('../myMod/myMod.module').then((m) => m.myModModule),}]

-- modules/myMod
----myMod.module.ts
        import { myModRoutingModule } from './myMod-routing.module';
        import { myModComponent } from './myMod.component';
        @NgModule({
            declarations: [myModComponent],imports: [CommonModule,myModRoutingModule]
        })
        export class myModModule {}

----myMod.component.ts
        import { LocationService } from '../../common/services/location.service';
        @Component({
            selector: 'app-myMod',templateUrl: './myMod.component.html'
        })
        export class myModComponent implements OnInit {
            constructor( private locationService: LocationService )

https://stackblitz.com/edit/angular-injection-error1

解决方法

您的 @Injectable 注释似乎缺少 providedIn 属性。

添加它应该可以解决问题：

@Injectable({providedIn: 'root'})
export class LocationService {
  ...
}