Documentation

Le t pipe

Tout ne peut pas être intégré dans un seul composant. Les attributs tels que placeholder ou title prennent une chaîne, et parfois tu as besoin d'une traduction dans ton code TypeScript. Pour cela, utilise la méthode t pipe ou translate du service MagicTranslate.

Le t pipe

import { Component } from '@angular/core';
import { TranslatePipe } from '@magic-translate/angular';


@Component({
  selector: 'app-search',
  imports: [TranslatePipe],
  template: `<input [placeholder]="'Search products' | t" />`
})
export class Search {}

Le pipe renvoie le texte d'origine jusqu'à ce que la traduction soit chargée. Comme le composant <t>, il prend la langue et la formalité comme options :

<input [placeholder]="'Your name' | t: { lang: 'fr', formality: 'formal' }" />

Traduire en code

Pour traduire une chaîne en TypeScript, appelle translate sur le service MagicTranslate. Cela renvoie une promesse.

import { inject } from '@angular/core';
import { MagicTranslate } from '@magic-translate/angular';


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


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

Sans l'option lang, le texte est traduit dans la langue actuelle.

PrécédentLe composant <t>SuivantPrérendu