GT ClassMethodsFormatting
formatMessage
Referencia de API del método formatMessage de GT
Descripción general
El método formatMessage da formato a mensajes con sustitución de variables y formato adaptado a la locale.
Basado en la biblioteca intl-messageformat de Format.JS, admite patrones de ICU message format.
Este método es esencial para la interpolación de variables y la pluralización. También admite el formato de números y de fechas, entre otras funciones.
const gt = new GT({
sourceLocale: 'en',
targetLocale: 'fr'
});
const formatted = gt.formatMessage('Hola {name}, tienes {count} mensajes', {
variables: { name: 'Alice', count: 5 }
});
// Devuelve: "Hola Alice, tienes 5 mensajes"Referencias
Parámetros
Prop
Type
Objeto de options
| Propiedad | Tipo | Opcional | Descripción |
|---|---|---|---|
locales | string | string[] | ✓ | Locale(s) que se usarán para el formateo (anula los valores predeterminados de la instancia) |
variables | FormatVariables | ✓ | Objeto que contiene variables para la interpolación de mensajes |
Tipo FormatVariables
type FormatVariables = {
[key: string]: string | number | Date | boolean;
};Devuelve
string - El mensaje con las variables reemplazadas y el formato específico del locale aplicado.
Comportamiento
Sustitución de variables
- Variables simples:
{variableName}→ se reemplaza por una cadena value - Patrones ICU:
{count, plural, ...}→ se procesan con las reglas de formato de ICU - Variables faltantes: resultará en un Error
- Doble llave: escapa el comportamiento de las llaves y se renderiza como una sola llave
Compatibilidad con Message Format
- Interpolación simple:
{variable} - Formato de números:
{price, number, ::currency/USD},{discount, number, percent},{num, number, integer} - Formato de fechas:
{date, date, short},{time, time, short} - Pluralización:
{count, plural, =0 {ninguno} =1 {uno} other {muchos}} - Selección:
{gender, select, male {él} female {ella} other {elle}} - Ordinales:
{place, selectordinal, =1 {#.º} =2 {#.º} =3 {#.º} other {#.º}}
Ejemplos
Sustitución básica de variables
const gt = new GT({ targetLocale: 'en' });
const message = gt.formatMessage('¡Bienvenido, {name}!', {
variables: { name: 'John' }
});
console.log(message); // "¡Bienvenido, John!"Pluralización con formato ICU
const message = gt.formatMessage(
'Tienes {count, plural, =0 {ningún artículo} =1 {un artículo} other {# artículos}} en tu carrito',
{
variables: { count: 3 }
}
);
console.log(message); // "Tienes 3 artículos en tu carrito"Formateo de números y moneda
const gt = new GT({ targetLocale: 'en' });
const message = gt.formatMessage(
'El total es {price, number, ::currency/USD} con un {discount, number, percent} de descuento',
{
variables: {
price: 99.99,
discount: 0.15
}
}
);
console.log(message); // "El total es $99.99 con un 15% de descuento"Plantillas de mensajes complejos
const orderStatusMessage = gt.formatMessage(`
Actualización del estado del pedido #{orderId}:
- Artículos: {itemCount, plural, =0 {ningún artículo} =1 {un artículo} other {# artículos}}
- Total: {total, number, ::currency/USD}
- Estado: {status, select,
pending {Pendiente}
shipped {Enviado}
delivered {Entregado}
other {Desconocido}}
- Entrega: {deliveryDate, date, short}
`, {
variables: {
orderId: 'ORD-12345',
itemCount: 3,
total: 149.97,
status: 'shipped',
deliveryDate: new Date('2024-03-20')
}
});Notas
- El método procesa la sintaxis del ICU message format para un formato avanzado usando
Intl.MessageFormatde Format.JS. - Las variables faltantes generarán un error.
- Se aplica automáticamente el formato de números, fechas y moneda específico del locale
Próximos pasos
- Consulta la documentación de
Intl.MessageFormatpara más opciones - Formatea números con formatNum
¿Qué te parece esta guía?