LangSwitcherComponent

The LangSwithcherComponentis designed to provide a simple interface for toggling between different languages in an application. It integrates with the TranslationService to dynamically switch the active language and update translations throughout the app.

How to use the component in your app :

1. import the component :

import { LangSwithcherComponent } from '@tradinos/cms-frontend-layout';

1. The selector for component , like it :

<lib-lang-switcher>
</lib-lang-switcher> 

Features

• Dynamic Language Switching: Enables seamless toggling between available languages.

• Integration with TranslationService: Automatically updates the app’s displayed content based on the selected language.

• Easy to Use: Can be added to any template with minimal configuration.

1. Ensure TranslationService is Configured

   The component works with the TranslationService. Make sure your app’s translation service is properly set up to handle language changes and provide translation files.

When you use the component in your app , it dynamically add the default languages , if you want to add or change the languages , you need to override the "avalibleLanguages" in translationService.

If you're using LIB_LAYOUT_CONFIG, ensure the configuration includes the following:

Example:

app.component.ts

langConfig: {
          availableLanguages: [
            {
              value: 'ar',
              label: 'العربية',
            },
            {
              value: 'en',
              label: 'English',
            },
          ],
        },

Default Language Behavior: The first language listed in the availableLanguages array will be used as the default language in the application. In the previous example, the arabic language will be the default.

• If no languages are explicitly selected or defined, the application will default to Arabic (ar).