0.0.2 • Published 4 years ago
ngx-translate-in v0.0.2
NgxTranslateIn
This lib will allow you to translate in other languages than the current one using a pipe translateIn
, you can translate a part of your html content in English while the current and default language is French.
Install
Run npm i ngx-translate-in --save
Usage
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { AppComponent } from './app.component';
import { NgxTranslateInModule } from 'ngx-translate-in';
export function translateHttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http);
}
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
HttpClientModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: translateHttpLoaderFactory,
deps: [HttpClient],
},
}),
NgxTranslateInModule, // import the module
],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
If you need a text to be in french while the current language is english, you can use the pipe like this:
<div>{{'translationKey' | translateIn: "fr" | async}}</div> <!-- translated in french -->
<div> {{"text1" | translate}} </div> <!-- translated in english -->
<div> {{"text2" | translate}} </div> <!-- translated in english -->