I18nController
Reactive controller for consuming translator and locale values from an HTML i18n context
Import
import { I18nController } from "@videojs/html";Usage
Create the controller with a reactive host and an i18n context. Read the translator from value and the active locale from locale.
import { I18nController, UIElement, i18nContext } from "@videojs/html";
class LocalizedPlayLabel extends UIElement {
readonly #i18n = new I18nController(this, i18nContext);
get label() {
return this.#i18n.value("buttons.play", { default: "Play" });
}
}The controller requests a host update when its context changes. Without a provider, it falls back to the default English locale and updates when registered translations change.
API Reference
Parameters
| Parameter | Type | Default | Details |
|---|---|---|---|
host* | object | — | |
| |||
context* | Context<symbol, I18nContextValue> | — | |
| |||
Return Value
| Property | Type | Details |
|---|---|---|
value | Translator | |
locale | (typeof LOCALES)[number] | string & object | |
hostConnected | (() => void) | |
hostDisconnected | (() => void) |