Estoy tratando de vincular una variable de TypeScript al servicio de traducción al igual que vincular en el marcado HTML, que funciona bien.

Esto es lo que he intentado hasta ahora

 ngOnInit() { this.customTranslateService.get("mainLayout.userProfileDropdown.changeLocale").subscribe((result) => { this.changeLocaleText = result; }) this.customTranslateService.translateService.onLangChange.subscribe((event: LangChangeEvent) => { this.changeLocaleText = this.customTranslateService.instant("mainLayout.userProfileDropdown.changeLocale"); }); this.userProfileMenuOptions = [ { text: this.changeLocaleText, itemId: "LocaleSelect" }, { text: "Report a bug", itemId: "BugReport" }, { text: "Request a feature", itemId: "FeatureRequest" }, { text: "Log Out", itemId: "LogOut" } ]; }

customTranslateService es solo un servicio que envuelve TranslateService .

La primera suscripción funciona bien, pero cuando cambio de idioma, onLangChange se activa y cambia el contenido de la variable correctamente, pero la referencia de userProfileMenuOptions a changeLocaleText no está vinculada, por lo tanto, no se actualiza.

El uso de un BehaviorSubject realmente no se puede hacer aquí, ya que es un código mecanografiado, no un marcado html que puede usar la tubería async .

Tal vez recrear la matriz userProfileMenuOptions cada vez que se llama a la suscripción de cambio de idioma podría ser una opción, aunque no estoy seguro de que le guste al componente que usa la matriz.

PD: instant funcionará aquí porque tengo un cargador de aplicaciones que carga todos los idiomas disponibles antes de que la aplicación esté disponible para el usuario.

Algunas ideas ?