Files from Angular
Translate an Angular i18n XLIFF file
Angular's ng extract-i18n writes your app's strings to messages.xlf. Open it here, translate each message with the developer's meaning and description beside it and the interpolations kept as tags, and export the file Angular builds the locale from — free, in your browser.
It opens in the editor in this browser tab. Nothing is uploaded.
Steps
- Extract the messages. Run ng extract-i18n. It writes messages.xlf, XLIFF 1.2 by default or XLIFF 2.0 with --format=xlf2. Copy it to the file name your angular.json expects for the language, such as messages.fr.xlf.
- Open the copy here. Drop it above. Every message is a row. A freshly extracted file has no translations, so every target starts empty; each message you translate gets a <target> straight after its <source>, indented like the lines around it.
- Translate with the developer's notes. The meaning and description from the i18n attribute are in the Details panel beside each message. Interpolations and HTML elements arrive as tags, named INTERPOLATION, START_BOLD_TEXT, LINE_BREAK and so on; hover one to see the markup it stands for, and place it where it belongs in the translation.
- Export and build. Choose Export (Ctrl+S), save the file over messages.fr.xlf, and build the locale the way you normally do, for example with ng build --localize.
Add the target language first
The extracted file is the source, so it has no target-language attribute (XLIFF 1.2) or trgLang (XLIFF 2.0). Add target-language="fr" to the <file> element, or trgLang="fr" to the <xliff> element, in your copy before you open it, using the same locale code as angular.json. Angular reads it as the file's locale, XLIFF 2.0 requires it once a file has targets, and the editor uses it for spelling, language rules in QA and the languages in a TMX export, which labels the translations "und" without it.
Plurals and selects (ICU)
An ICU message such as {VAR_PLURAL, plural, =0 {just now} other {…}} is one row of text, with any interpolation inside it as a tag. Translate the words inside the branches and leave VAR_PLURAL, plural, select and the case names as they are. QA does not parse ICU, so it will not notice a translated keyword; and a one-word branch such as male {male} looks like a {placeholder} to the placeholder check, which then reports a correct translation of it as a mismatch. Check ICU rows by eye.
What comes back unchanged
Context groups, notes, ids, the datatype attributes and every message you did not translate are written back byte for byte. In XLIFF 1.2 the source file and line number sit in a context group, which the editor does not show; in XLIFF 2.0 they are a location note, which it does. Each target you translate gets a standard XLIFF state: on the <target> in 1.2, on the <segment> in 2.0.
Pseudo-translation and ICU
Pseudo-translating the file before translation shows hard-coded strings and layouts that break on longer text. The pseudo-translation tool keeps placeholders and tags intact, but it accents ICU keywords too, so a pseudo file of an app with plural or select messages will not build. Run it on a copy without those messages.
Not yet tested with Angular
We have not run a file through Angular's own import yet. What is tested is the file itself: everything outside the targets you edited comes back byte for byte as it arrived, which is what an importer depends on. If Angular refuses a file from here, please send it to us.