There is fork of "Minko Gechev" Route-level code splitting in Angular sample app with Translation and Overlay injections.
import { Component, OnInit, Injectable } from '@angular/core';
import { CookieService } from "ngx-cookie-service";
import { ComponentType, Overlay, OverlayConfig } from "@angular/cdk/overlay";
import { TranslateService } from "@ngx-translate/core";
@Injectable({
providedIn: 'root'
})
export class OverlayService {
constructor(public overlay: Overlay) {}
}
@Component({
selector: 'app-nyan',
template: '<img src="/assets/nyan.png">',
styleUrls: ['./nyan.component.css']
})
export class NyanComponent implements OnInit {
constructor(
private cookieService:CookieService,
private translateService:TranslateService,
//private overlayService: OverlayService
){
// No provider for Overlay! trouble
// const overlayRef = this.overlayService.overlay.create();
// //touch overlay
// console.log(overlayRef);
}
ngOnInit(): void {
// it was same trouble for cookieService but it's gone
const lang=this.cookieService.get('lang')||'en';
//touch cookieService
console.log(lang);
this.translateService.setDefaultLang('en');
this.translateService.use(lang);
// NullInjectorError: No provider for TranslateStore! patch from https://gitmemory.com/issue/ngx-translate/core/883/532257699
// does not work.
this.translateService.store.onLangChange.subscribe((lang) => this.translateService.use(lang));
}
}
The error I got was:
"Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[TranslateService -> TranslateStore]: in lazy module
or
"ERROR
Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[InjectionToken cdk-connected-overlay-scroll-strategy -> Overlay]:
StaticInjectorError(Platform: core)[InjectionToken cdk-connected-overlay-scroll-strategy -> Overlay]:
NullInjectorError: No provider for Overlay!"
for version of "Overlay components uncommented".
Here is a stackblitz.
Valentin Buriakov :
To use TranslateService in lazy modules you should first add in your AppModule: \nimports: [TranslateModule.forRoot(), HttpClientModule]\n\nUsing forRoot will inject TraslateService on your app-level as singleton.\n\nAnd for using Overlay in your OverlayService you should remove providedIn: 'root'; and add OverlayService to your NyanModule providers:\n\n providers:[\n CookieService,\n OverlayService\n ]\n\n\nBecause for using OverlayModule which is imported in your lazy module, this service should be a part of this module. ",
2020-01-15T14:38:38
Fahad Hassan :
It seems like you didn't include TranslateService in your app.module.ts providers array like this\n\nproviders : [TranslateService, TranslateStore ]\n",
2020-01-15T13:05:41