ngx-dy-i18n
v0.0.3
Published
The internationalization (i18n) little hack to use native i18n translations in controller
Downloads
8
Maintainers
Readme
ngx-dy-i18n simple hack to use translations in controller with native i18n solution, without using other library for i18n(ngx-translate , ...) it support grouped translations
Usage
1. Import the I18NModule
:
You have to import I18NModule.forRoot()
in the root NgModule of your application.
The forRoot
static method is a convention that provides and configures services at the same time.
Make sure you only call this method in the root module of your application, most of the time called AppModule
.
import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';
import {I18NModule} from 'ng-dy-i18n';
@NgModule({
imports: [
BrowserModule,
TranslateModule.forRoot()
],
bootstrap: [AppComponent]
})
export class AppModule { }
2. add some translations:
1. Directly in AppComponent using directive
<dyTranslateToken id="title" value="nice title" i18n-value></dyTranslateToken>
<dyTranslateToken id="errors">
<dyTranslateToken id="notFound" value="page not found" i18n-value></dyTranslateToken>
<dyTranslateToken id="unknown" value="unknown error" i18n-value></dyTranslateToken>
</dyTranslateToken>
2. Using another component for all translation using component loader
- add new dummy component
ng g component I18nTexts
- add it to entryComponents list
... entryComponents: [ I18nTextsComponent ] ...
- Inject DyTranslateService in bootstrapped component usually AppComponent
import {DyTranslateService} from 'ng-dy-i18n'; ... constructor(private tr: DyTranslateService) {} ...
- One time load the translations
... ngOnInit(): void { this.tr.addTranslationFromComponent(I18nTextsComponent); } ...
3. Get the translations:
to get the translations you have to use the provided service DyTranslateService
this.tr.get('alert.title').subscribe(value => {
alert(value)
});
don't forget to unsubscribe to avoid the memory leaks