I18nController

Import

import { I18nController } from "@videojs/html";

Usage

Create the controller with a reactive host and an i18n context. i18nContext is the default context that <media-i18n> provides; its I18nContextValue holds the active translator and locale. 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.

{ addController(controller: ReactiveController): void; removeController(controller: ReactiveController): void; requestUpdate(): void; updateComplete: Promise<boolean> } & HTMLElement