Signal Aurelia Custom Attribute?

For the binding, I can use signal in case the value is externally updated. How about a custom attribute?

I have the following data-language custom attribute:

import { customAttribute, autoinject } from 'aurelia-framework';
import { LanguageService } from "./language";

export class LanguageCustomAttribute {

    private value: string;

        private element: Element,
        private languageService: LanguageService) { }

    public bind() {
        var e = $(this.element);


This custom attribute is globally registered using


Now assume user can change a language at runtime (and the result of this.languageService.getText would change). How can I send a signal so all [data-language] elements are updated?

This is exactly what the TCustomAttribute from aurelia/i18n does.

Thank you for the help. If I understand correctly, it uses EventAggregator right? Could you elaborate how I can trigger such event?

this.subscription = this.ea.subscribe('i18n:locale:changed', () => {
  this.service.updateValue(this.element, this.value, this.params !== null ? this.params.value : undefined);

Is the name i18n:locale:changed anything I want, can I register a custom one?

Thats correct, it uses the EventAggregator. The event is triggered by the i18n service, which emits the new event once the user changes the active locale.

The name i18n:locale:changed can be really whatever you want as it just names the event itself. Additionally during emit, you’ll likely want to pass on additional data, as depicted in linked sample

1 Like

Wonderful! Thanks a lot.