Effortlessly convert ISO 639-1 locale codes (like 'en', 'fr', 'de') into human-readable language names or native names using a simple Angular pipe or service.
npm install @andreasnicolaou/locale-translator🟢 For Angular 15+ (Standalone Projects)
You can directly import the pipe into any standalone component:
import { TranslateLocalePipe } from '@andreasnicolaou/locale-translator';
@Component({
standalone: true,
selector: 'your-component',
imports: [TranslateLocalePipe],
templateUrl: './your-component.html',
})
export class YourComponent {}🟠 For Angular <15 or Module-Based Projects
Use the provided LocaleTranslationsModule to wrap the pipe and service:
import { LocaleTranslationsModule } from '@andreasnicolaou/locale-translator';
@NgModule({
declarations: [],
imports: [LocaleTranslationsModule],
exports: [],
})
export class YourModule {}💡 Note: If you're using Angular 15+ but prefer NgModule-based architecture, you can also use the module wrapper for compatibility.
import { LocaleTranslationsService, LocaleCode, LocaleType } from '@andreasnicolaou/locale-translator';
export class MyComponent {
constructor(private readonly localeTranslationsService: LocaleTranslationsService) {
const locale: LocaleType | undefined = this.localeTranslationsService.getLocale('en');
console.log(locale); // Logs the name and the nativeName
const localesMap: Map<LocaleCode, LocaleType> = this.localeTranslationsService.getAll();
console.log(localesMap); // Logs all available locales
}
}The service provides methods to retrieve locale data and manage translations.
| Method | Description |
|---|---|
getLocale(code: LocaleCode): LocaleType |
Retrieves the language details for a given locale code. If no translation is found, returns undefined. |
getAll(): Map<LocaleCode, LocaleType> |
Retrieves all language data, where the keys are locale codes, and the values are LocaleType objects. |
The translateLocale pipe is used to translate a locale code into its respective name or native name.
| Argument | Type | Description |
|---|---|---|
code |
LocaleCode |
The locale code (e.g., 'en', 'fr'). This argument is required. |
native |
boolean (default: false) |
If set to true, the pipe will return the native name of the locale. |
The pipe returns the language name by default. To get the native name, pass true as a second argument.
<div>{{ 'en' | translateLocale }}</div><div>{{ 'en' | translateLocale:true }}</div>- Having an issue? or looking for support? Open an issue and we will get you the help you need.
- Got a new feature or a bug fix? Fork the repo, make your changes, and submit a pull request.
If you find this project useful, please star the repo to let people know that it's reliable. Also, share it with friends and colleagues that might find this useful as well. Thank you 😄