API de JavaScript

También puedes utilizar el cliente Magic Translate directamente en tus guiones para traducir cadenas y cambiar el idioma.

Obtener la instancia

Con la etiqueta script, la instancia se crea una vez que la página se ha cargado y está disponible como window.magicTranslate. Para usarlo en cuanto esté listo, escucha el evento magictranslate:ready:

document.addEventListener('magictranslate:ready', (event) => {
  const magicTranslate = event.detail;
});

Con npm, createMagicTranslate devuelve la instancia.

Traducir en código

Para traducir una cadena, llama al translate. Devuelve una promesa.

const message = await magicTranslate.translate('Your order has been placed');

// with options
const formal = await magicTranslate.translate('How are you?', {
  lang: 'fr',
  formality: 'formal'
});

Sin la opción lang, el texto se traduce al idioma actual. Con un id, puedes editar este uso del texto por sí solo.

Los valores que no deberían traducirse van en v, referenciados como $name. El texto se traduce una vez como plantilla y se almacena en caché, sean cuales sean los valores:

const message = await magicTranslate.translate('Your order $id has shipped', {
  v: { id: order.id }
});

El idioma actual

Lee el idioma actual con magicTranslate.language. Usa setLanguage para cambiarlo y volver a traducir la página, o onLanguageChange para hacer una llamada cada vez que cambie el idioma:

magicTranslate.setLanguage('fr');

const unsubscribe = magicTranslate.onLanguageChange((language) => {
  document.documentElement.lang = language;
});

Detener

destroy deja de traducir la página. El contenido que ya está traducido permanece traducido.

magicTranslate.destroy();