Problem with </p> Tag

[BSchuhmacher]

Hi

When extracting strings from a file with

node node_modules/@ngx-translate/i18n-polyfill/extractor/ngx-extractor -i "src/*/.ts" -f xlf -o src/locale/messages.xlf

I stumbled upon the following error:

....node_modules/@ngx-translate/i18n-polyfill/extractor/src/message-bundle.js:14 throw htmlParserResult.errors; ^ Unexpected closing tag "p". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("Please choose one:[ERROR ->]<\/p>"): 0:18

The matching TS Code looks like this:

let meldung = this.i18nSuper('<p>Choosen boom length could be reached with different boom sequences.<br />');
meldung += this.i18nSuper('Please choose one:</p>');

If I take out the closing tag (<\/p>) from the second line it works as expected. I think that it should work in the original version to, as it should be possible to do something like this:

let text1 = i18n('<p>Bla Bla Bla ....');
if (someCondition) {
    text2 = i18n('some more words</p>');
} else {
    text2 = i18n('some other words</p>');
}
This will end with an error like the one given above.
Regards
Bernd

[ocombe]

You should use an ICU expression for that kind of switch case: https://angular.io/guide/i18n#select-among-alternative-text-messages

[BSchuhmacher]

OK.This is true for the example given but I could think of cases where I concatenate strings containing opening and closing tags in different parts (which should be concatenated). There I would run into the same problem.

[ocombe]

Yes, the problem is that I'm using the same parsers that are used for the templates, and in the templates they fail if you have html tags that are not closed. The idea is that the same piece of code here will match the same piece of html template and only be extracted once for both. I'm not sure how we will solve that in our actual implementation once we add code translations in angular, so I'd rather leave it like this for now.

If you need to use html, you should probably do it in your template instead.

[leiserfg]

Or keep the p tag out of the translation

[shobhit12345]

@ocombe Can we use i18n-polyfills with ICU expression?i have get no solution how to implement that

[shobhit12345]

Can any one know how deal with innerHTML. titles are coming form .ts files, declared as const <h3 class="mt-5-mob-tab pl-4 pr-4 pr-lg-6 pl-lg-6 " [innerHTML]="needHelpItem.title">

[NagaSainath]

Can anyone tell me how can I use i18n outside the class like enums or const arrays something like .model.ts files?