Angular 9中$localize标记的TypeScript文本无法被ng xi18n提取

嘿，我来帮你理清这个问题～

首先明确一点：Angular 9确实不支持用ng xi18n提取TypeScript代码中用$localize标记的文本，这个功能是从Angular 10开始正式集成到ng xi18n工具里的。所以你怀疑的点完全正确，升级到Angular 10及以上版本后，执行ng xi18n就能解决这个提取问题。

关于Angular 9的限制 #

Angular 9虽然引入了$localize，但它当时主要是用于运行时翻译，官方的ng xi18n工具在这个版本里只负责扫描HTML模板中的i18n属性，不会遍历TS文件去识别$localize标记的文本。所以哪怕你按正确格式写了$localize':@@info:It's green!'，ng xi18n也不会把这条消息提取到xlf/xliff文件里。

升级到Angular 10+后的解决步骤 #

升级完成后，你只需要确保以下几点，就能顺利提取TS中的$localize消息：

• 保持$localize的用法正确：格式为$localize':@@唯一消息ID:要翻译的文本!'，比如你写的$localize':@@info:It's green!'就符合要求。
• 直接执行ng xi18n命令即可，Angular 10+的xi18n工具默认会扫描项目中的TS文件，自动提取里面的$localize标记内容。如果需要指定扫描范围，可以用--include参数，比如ng xi18n --include src/app/**/*.ts。
• 升级过程建议遵循Angular的版本升级步骤，逐步从9升到10，再到你需要的目标版本，确保所有依赖（比如@angular/core、@angular/cli等）都同步更新，避免出现兼容性问题。

若暂时不想升级的替代方案 #

如果暂时无法升级Angular版本，你可以用以下临时方法处理TS中的翻译文本：

• 把需要翻译的文本转移到HTML模板中，用i18n属性标记，这样ng xi18n就能正常提取。
• 手动收集TS中的$localize文本，然后添加到生成的xlf/xliff文件里，但这种方式需要手动维护，比较繁琐，不推荐长期使用。

内容的提问来源于stack exchange，提问作者Nida