Translate an Angular app into Chinese (Simplified)

What Chinese changes inside messages.xlf

Simplified Chinese has a single CLDR plural category: other. A source ICU expression such as {count, plural, =1 {1 file} other {{{count}} files}} needs no one branch in Chinese; the branch that matters is {count, plural, other {{{count}} 个文件}}, optionally with an exact =0 branch if you want a dedicated empty-state message. Nouns do not inflect, but a measure word sits between number and noun: 个 in general, 条 for messages, 项 for list items.

Word order shifts. ‘Welcome back, {{ name }}’ becomes ‘{{ name }}，欢迎回来’, with the interpolation moved to the front. In the XLIFF it appears as a tag (<x id='INTERPOLATION'/> in 1.2, <ph .../> in 2.0). The tag may move within the target; it must simply not disappear.

Punctuation is full-width: ，。：？！. ‘Name:’ becomes ‘姓名：’. There are no spaces between words. Chinese text uses two to three times fewer characters than English, but each character is wider, so the space taken on screen changes little, whatever your source language.

Fonts, line breaks and CSS: what happens outside the file

A Latin font has no Chinese characters. If your theme loads a web font subset to Latin, the browser falls back to a system font for the hanzi, and the mismatch shows in buttons and headings. Give the Chinese locale an explicit fallback stack, for instance font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;, applied through :lang(zh) or a class on the root element.

Some CSS rules stop working or misbehave:

• text-transform: uppercase does nothing to hanzi, so a label styled only by capitals loses its emphasis.
• Chinese typography has no italic; the browser slants the glyphs artificially. Use weight or colour for emphasis instead.
• letter-spacing tuned for Latin text spreads characters apart and makes reading choppy.
• maxLength validators count characters: a 20-character limit allows a full sentence in Chinese.

The browser can break a line between any two hanzi, so long strings rarely overflow, but a button label may split in the middle of a two-character word. Test fixed-width components.

What Manuce returns, and what it does not do

You get the same messages.xlf, in XLIFF 1.2 or 2.0 depending on what you extracted: indentation, order, quotes, comments, line endings, encoding and BOM are preserved; only the targets are filled in. Every translated value is checked against its source: if an interpolation tag or variable is missing or altered and the discrepancy persists, the source value is kept and the report says so. You know exactly which strings remain in the source language and why.

Not translated: IDs (including custom @@id values), empty values, URLs, email addresses, numbers, colours, date formats and anything marked as non-translatable. The quote counts the words in the values only, tags and IDs excluded; Chinese carries a ×1.6 coefficient on the per-word rate.

Manuce does not:

• edit angular.json, your fonts or your CSS;
• translate text you have not marked with i18n or $localize, since it is not in the file;
• produce Traditional Chinese (Taiwan, Hong Kong), which is a separate language to order on its own if you target those markets.

On the first run, check the ICU expressions yourself: the other branch is the one Chinese will display.

Preparing the project and checking the result

Before extracting, give short labels some context. ‘Open’ can be a verb (打开) or a state (开放中); a description such as i18n='Button that opens the file|Open@@fileOpenButton' is carried into the XLIFF and removes the ambiguity. Do not append punctuation in the template: {{ label }}: would render ‘姓名:’ with a half-width colon; put the colon inside the translatable string.

For dates, avoid fixed patterns like 'MM/dd/yyyy' in the DatePipe: date formats are not translated. With a named format ('longDate', 'mediumDate') the Chinese locale outputs a form like 2025年3月5日 on its own.

After delivery:

• read the report and deal with any strings left untranslated;
• declare the locale (zh-Hans or zh) and the translated file path in the project's i18n configuration, then build with --localize;
• walk through screens with plurals (0, 1, 5 items), form error messages and narrow buttons;
• look for empty boxes in place of characters, the sign of a font without hanzi.

In practice

1. Mark your text with i18n or $localize, adding descriptions to ambiguous labels.
2. Run ng extract-i18n and upload the resulting messages.xlf to Manuce.
3. Review the free sample, pick a level and accept the quote.
4. Download the filled file and the report, name it for the zh-Hans locale and register it in angular.json.
5. Build with --localize and check fonts, plurals and buttons on screen.