Core: EXCEPTION: No provider for TranslateStore!

[steven-zou]

I'm submitting a ... (check one with "x")

[ ] bug report => check the FAQ and search github for a similar issue or PR before submitting
[ ] support request => check the FAQ and search github for a similar issue before submitting
[ ] feature request

Current behavior
Throw exception : EXCEPTION: No provider for TranslateStore!

Expected/desired behavior
Do the right translation

Reproduction of the problem
If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the steps to reproduce and if possible a minimal demo of the problem via https://plnkr.co or similar. You can use this template as a starting point: http://plnkr.co/edit/tpl:01UjWY3TKfP6pgwXKuEa

What is the expected behavior?

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• ngx-translate version: 6.0.0

• Angular version: 2.4.7

• Browser: [Chrome XX | Firefox XX ]

Import TranslateModule from AppModule:

`
import { TranslateModule, TranslateLoader, MissingTranslationHandler } from "@ngx-translate/core";
import { MyMissingTranslationHandler } from './i18n/missing-trans.handler';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { Http } from '@angular/http';

export function HttpLoaderFactory(http: Http) {
return new TranslateHttpLoader(http, './i18n/lang', '-lang.json');
}

@NgModule({
declarations: [
AppComponent,
],
imports: [
SharedModule,
BaseModule,
AccountModule,
TranslateModule.forChild({
loader: {
provide: TranslateLoader,
useFactory: (HttpLoaderFactory),
deps: [Http]
},
missingTranslationHandler: {
provide: MissingTranslationHandler,
useClass: MyMissingTranslationHandler
}
})
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {
}
`

And then export it in the sharedModule:

`
import { TranslateModule } from "@ngx-translate/core";

@NgModule({
imports: [
CoreModule,
TranslateModule.forChild()
],
declarations: [
MessageComponent,
MaxLengthExtValidatorDirective,
FilterComponent
],
exports: [
CoreModule,
MessageComponent,
MaxLengthExtValidatorDirective,
FilterComponent,
TranslateModule
],
providers: [SessionService, MessageService]
})
export class SharedModule {

}
`

Not do any translation yet, it already throw the exception. If did not export it in the sharedModule, then there is no exception, but the 'translate' pipe will not be found.

Any suggestion?

[steven-zou]

Sorry, find the problem, forgot to change "TranslateModule.forChild" to "TranslateModule.forRoot" in the AppModule. Will close it.

[jackeykoh]

hi steven,
forchild is valid in your project?it can additional JSON files per component / module, i.e. an admin.json for the administration panel. ref issue https://github.com/ngx-translate/core/issues/444

[oak-wildwood]

I get this exact same error when trying to use this library with .forChild in my SharedModule with the latest Ionic 3 lazy loading system. It works great without the lazy loading stuff. Can't wait until this is supported. Otherwise great work guys!

[Nexus4me]

Hi, I get this Error when I run karma tests: No provider for TranslateStore! putting TranslateStore to app.module providers list doesn't help. Any suggestions?

I am using:
"@ngx-translate/core": "^6.0.1",
"@ngx-translate/http-loader": "0.0.3",
Angular version: 2.4.7

[lasimone]

Was a solution ever found?

[AbdallahBedir]

The solution for me is importing "TranslateModule.forChild" in the SharedModule and importing "TranslateModule.forRoot" in the AppModule

[veluvj]

The solution for me is importing "TranslateModule.forChild" in the SharedModule and importing "TranslateModule.forRoot" in the AppModule

This worked for me.