Ik gebruik deze @ngx-translate/core i18n-service en het werkt prima in sjablonen (.html) met deze syntaxis:
{{‘my.i18n.key’|translate}}
Nu wil ik iets vertalen in mijn componenttypescript-bestand (.ts), maar ik weet niet hoe ik het moet gebruiken.
Ik kan een translate-object maken in mijn constructor:
constructor(private translate: TranslateService) {}
en hoe vertaal je nu ‘my.i18n.key’ ?
Antwoord 1, autoriteit 100%
Als je iets in je typoscript-bestand wilt vertalen, doe je het volgende
constructor(private translate: TranslateService) {}
gebruik dan zo waar je wilt vertalen
this.translate.instant('my.i18n.key')
Antwoord 2, autoriteit 49%
Van het document op github:
get(key: string|Array, interpolateParams?: Object):
Waarneembaar: haalt de vertaalde waarde van een sleutel (of een
reeks sleutels) of de sleutel als de waarde niet is gevonden
probeer in je controller/klasse:
constructor(private translate: TranslateService) {
let foo:string = this.translate.get('myKey');
}
Antwoord 3, autoriteit 8%
Volg de code om te vertalen in Typscript-bestand
Importeren in kop
import { TranslateService } from '@ngx-translate/core';
In constructor declareren als
public translate: TranslateService
Stel dat het JSON-bestand er zo uitziet
{
"menu":{
"Home": "Accueil"
}
}
Declareer de onderstaande code in de constructor.
Opmerking: Sleutel staat voor uw belangrijkste sleutelwaarde die wordt gebruikt in het language.json-bestand (hier is het “menu”)
this.translate.get('menu').subscribe((data:any)=> {
console.log(data);
});
Antwoord 4, autoriteit 3%
Ik weet niet of het probleem is wanneer dit werd gepost, maar het toewijzen van de “get”-methode aan een variabele om de vertaalde string te krijgen, zal niet werken, omdat het een waarneembare teruggeeft
get moet als volgt worden gebruikt:
constructor(private translate: TranslateService) { }
:
:
this.translate.get ('KEY_TO_TRANSLATE').subscribe (x=> this.translation = x);
Om de string te krijgen, kun je de Instant-methode gebruiken:
this.translation = this.translate.instant('KEY_TO_TRANSLATE')
Dit is echter een synchrone methode, dus als de vertaling nog niet is geladen, krijgt u de sleutel, niet de waarde. Het wordt allemaal uitgelegd in de documentatiedie te vinden is in Github.
Antwoord 5, autoriteit 2%
Dit werkt voor mij (ik gebruik Angular 7).
Importeer gewoon de Translate-service op de constructor en roep het dan vanuit mijn functie als volgt aan:
getTranslation(){
let translation = "";
let clientTranslation = this.translate.get('auth.client').subscribe(cliente =>{
translation = cliente;
document.getElementById("clientTest").setAttribute('value', translation);
}
}
Ik gebruikte de vertaling op een formulier, dus ik geef het door aan de invoer met
setAttribute, ik hoop dat dit voorbeeld kan helpen.
Antwoord 6, autoriteit 2%
Ik gebruik hoek 8 > In mijn geval > Als u een typoscript-tekenreeks in een andere taal wilt vertalen, gebruik dan dit >
Maak eerst een servicebestand om de vertaalwaarde te krijgen. Hieronder vindt u mijn code voor het bestand globaltranslate.service.ts
import { Injectable } from '@angular/core';
import {TranslateService} from '@ngx-translate/core';
constructor(public translate: TranslateService) {}
Maak dan een return-functie……..
getTranslation(str) {
const currentLang = this.translate.currentLang; // get current language
const returnValue = this.translate.translations[currentLang][str]; // get converted string from current language
if (returnValue === undefined) {
return this.translate.translations.en_merch[str]; // if value is getting undefined then return default language string, en_merch is default english language file here
} else {
return returnValue;
}
}
En in het bestand component.ts kunt u het servicebestand importeren en gebruiken zoals onderstaande code…
import {GlobaltranslateService} from '../../../../services/globaltranslate.service';
@Component({
selector: 'app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
providers: [GlobaltranslateService] // add service in provider
})
constructor(
private gTranslate: GlobaltranslateService // add service into constructor
) {}
const title = this.gTranslate.getTranslation('Title text'); // get return value by calling function 'getTranslation' in globaltranslateservice.
Deze oplossing is beter voor alle projecten van i18nen hoekigngx translate
Dit werkt ook op sweetalert2 strings zoals onderstaande code
Swal (
this.gTranslate.getTranslation('Warning'),
data.message,
'warning'
);
Bedankt voor het lezen. Als je vragen hebt, stuur dan een bericht.
Antwoord 7, autoriteit 2%
U kunt de methode translate.instant() gebruiken en de sleutelnaam doorgeven die is opgeslagen in uw i18n-bestand. bijvoorbeeld:
translate.instant('hello');
en als dat van een parameter of variabele komt, geef de waarde dan direct door.
translate.instant(my.i18n.key);
Je kunt hier ook naar verwijzen:
https://github.com/ngx-translate/core/issues/ 835#issuecomment-384188498
Antwoord 8
errorMessage:string="";
constructor(
protected translate:TranslateService,
) {
}
ngOnInit(): void {
this.translate.get('PLEASE_ENTER_OTP').subscribe(data=>{
this.errorMessage=data;
})
}
Je kunt het waarneembare abonneren in ngOninit