在模板html標簽中增加i18n
<h1 i18n>Hello world!</h1>
使用ng命令產(chǎn)生xlf格式的message.xlf文件
$ ng xi18n --output-path src/i18n
命令執(zhí)行后,生成 src/i18n/messages.xlf 文件
<?xml version="1.0" encoding="UTF-8" ?><xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2"> <file source-language="en" datatype="plaintext" original="ng2.template"> <body> <trans-unit id="5816217f424111ae4c91dd72ee1db0ae252763b5" datatype="html"> <source>Hello World!</source> <target/> </trans-unit> </body> </file></xliff>
復(fù)制message.xlf,message.en.xlf(英文版本) message.zh.xlf中文版本
<?xml version="1.0" encoding="UTF-8" ?><xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2"> <file source-language="en" datatype="plaintext" original="ng2.template"> <body> <trans-unit id="5816217f424111ae4c91dd72ee1db0ae252763b5" datatype="html"> <source>Hello World!</source> <target>Hello World!</target> </trans-unit> </body> </file></xliff>
<?xml version="1.0" encoding="UTF-8" ?><xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2"> <file source-language="en" datatype="plaintext" original="ng2.template"> <body> <trans-unit id="5816217f424111ae4c91dd72ee1db0ae252763b5" datatype="html"> <source>Hello World!</source> <target>哈嘍,世界!</target> </trans-unit> </body> </file></xliff>
$ ng serve --aot / --i18n-file=src/i18n/messages.zh.xlf / --locale=zh / --i18n-format=xlf
現(xiàn)在瀏覽,顯示的是中文版本
$ for lang in en zh; do / ng build --output-path=dist/$lang / --aot / -prod / --bh /$lang/ / --i18n-file=src/i18n/messages.$lang.xlf / --i18n-format=xlf / --locale=$lang; / done
這個命令執(zhí)行完畢后,生成了en和zh兩種語言版本。http://localhost:4200/en訪問英文版本,http://localhost:4200/zh訪問中文版本。--bh指定默認版本,http://localhost:4200訪問時,跳轉(zhuǎn)到默認版本。
修改package.json文件,加入腳本
{ [...] "scripts": { [...] "build-i18n": "for lang in en zh; do ng build --output-path=dist/$lang --aot -prod --bh /$lang/ --i18n-file=src/i18n/messages.$lang.xlf --i18n-format=xlf --locale=$lang; done" } [...]}這樣就可以執(zhí)行npm run build-i18n 命令,一次build多個語言版本了。
windows用戶命令
> ng build --output-path=dist/zh --aot -prod --bh /zh/ --i18n-file=src/i18n/messages.zh.xlf --i18n-format=xlf --locale=zh> ng build --output-path=dist/en --aot -prod --bh /en/ --i18n-file=src/i18n/messages.en.xlf --i18n-format=xlf --locale=en
新聞熱點
疑難解答
圖片精選