Search code examples
icuangular-i18nmessageformat.js

ICU expression *select* not detecting empty value

I am translating my app using i18n angular 7, and I'm having problems with a ICU expression select. The issue is that I want the condition to recognize and empty value like this: animal: string

<div i18n="@@example> 
    { animal, select, EMPTY { Cat } dog { Dog } other { Pig } }
</div>

I have tried using

{ animal, select, undefined { Cat } dog { Dog } other { Pig } }

but it didn't work

when animal is:

(empty string, null or undefined) -> translate Cat

dog -> translate Dog

other -> translate Pig

Solution

  • Unfortunately it seems that the key for each translation case of the select is taken as a string, not an expression, so your undefined there is taken as "undefined", and EMPTY as "EMPTY".

    As a workaround you can evaluate animal + "" as your select condition. undefined + "" === "undefined", and it will match "undefined" in your select cases:

    { animal + "", select, undefined { Cat } dog { Dog } other { Pig } }

    That said, you could convert undefined to any string value you think won't actually appear in the animal variable for the same result:

    { animal === undefined? "geranium" : animal , select, geranium { Cat } dog { Dog } other { Pig } }