I am using intro.js for showing quick start tour in angular. I am using data-intro and data-step attributes to display order and information of component that is displaying next in quick start tour.
I am not able to translate data-intro. I tried using below Scenario 1. In HTML file, [data-intro] ='"next step" | i18n' data-intro ='{{"next step" | i18n"}}' when i ran, that particular next step screen is getting hidden
scenario 2. In ts File
data_1 = this.i18n.t("next step") when i print data_1, getting translated text. in html file
[data-intro]="data_1"when i ran, I am getting data_1 in that particular screen tour instead of translated text.
I tried both scenarios. But neither of them is worked.
Any help is appreciated. I am not why it is not translation.
When i try to translate using i18n, I need that particular data-inro of component need to be translated based user selected language.
Intro code is vanilla and so rendered outside of Angular. I can only imagine without knowing your code base that intro.js is instanced pre angular template compilation completion.
Intro.js when instanced grabs the values and caches them, so I would suggest getting it to set itself up AfterViewInit.