import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { useLocale } from 'angular-intlayer';
@Component({
selector: 'app-locale-switcher',
standalone: true,
imports: [CommonModule],
template: `
<div class="locale-switcher">
<select
[value]="locale()"
(change)="setLocale($any($event.target).value)"
>
@for (loc of availableLocales; track loc) {
<option [value]="loc">{{ loc }}</option>
}
</select>
</div>
`,
styles: [
`
.locale-switcher {
margin: 1rem;
padding: 0.5rem;
border: 1px solid #ccc;
border-radius: 4px;
width: fit-content;
}
`,
],
})
export class LocaleSwitcherComponent {
localeCtx = useLocale();
locale = this.localeCtx.locale;
availableLocales = this.localeCtx.availableLocales;
setLocale = this.localeCtx.setLocale;
}