Skip to content

Localization

Localization in the MDCGrid class is managed through a flexible system that allows for the retrieval, updating, and setting of localization data for different locales. Proper localization ensures that your application can be used by a global audience by providing translations and adapting content based on the user’s language preferences.

The MDCGrid class includes three key functions for managing localization:

  1. getLocalizations: Retrieve the localization data for the English locale.
  2. setLocalizationData: Update or add new localization data for a given locale.
  3. setDefaultLocale: Set the default locale for the application and switch the current language.

API Reference

getLocalizations

Description:
Retrieves the current localization data for the English locale. This function is useful for getting the base translations in English, which can then be used as a reference or template for other locales.

Returns:

  • object: An object containing the localization data for the English locale. This object includes key-value pairs where the keys are translation keys and the values are the corresponding translations.

Usage:

const englishData = mdcGrid.getLocalizations();
console.log(englishData);
// Example output: { welcome_message: "Welcome", farewell_message: "Goodbye" }

Use Case:

  • Base Locale Reference: Use this function to retrieve the base English translations. This can serve as a template for translating the application into other languages.

setLocalizationData

Description: Updates or adds new localization data for a specified locale. This function allows you to manage and refresh the translations used in the application for different locales.

Parameters:

  • localeCode (string): The code of the locale to update. For example, “fr” for French.
  • data (object): An object containing the new localization data to set. This object should include translation keys and their corresponding values for the specified locale.

Returns:

  • void: No value is returned. The function performs the update operation and modifies the localization data internally.

Usage:

const newData = {
welcome_message: "Bienvenue",
farewell_message: "Au revoir"
};
mdcGrid.setLocalizationData("fr", newData);

Use Case:

  • Updating Translations: Use this function to set or refresh translations for a specific locale, ensuring that all necessary translation keys are included to maintain consistency in the application.

setDefaultLocale

Description: Sets the default locale for the application and changes the language used. This function is crucial for initializing or switching the language environment in the application.

Parameters:

  • localeCode (string): The code of the locale to set as the default. For example, “fr” to set French as the default locale.

Returns:

  • void: No value is returned. The function changes the language setting internally and handles potential errors.

Usage:

mdcGrid.setDefaultLocale("fr");
// This sets French as the default language for the application.

Use Case:

  • Language Initialization: Use this function to initialize the application with a specific language or switch languages dynamically based on user preferences.

Example

Here’s a complete example demonstrating how to use all three localization functions together:

// 1. Retrieve the base localization data for English
const englishData = mdcGrid.getLocalizations();
console.log("Current English Data:", englishData);
// 2. Update the localization data for French
const updatedFrenchData = {
...englishData,
welcome_message: "Bienvenue à notre application",
farewell_message: "À bientôt"
};
mdcGrid.setLocalizationData("fr", updatedFrenchData);
console.log("French Data Updated");
// 3. Set French as the default locale
mdcGrid.setDefaultLocale("fr");
// This will initialize the application with French as the default language.