新聞中心
將翻譯結(jié)果合并到應(yīng)用程序中
要將完成的翻譯結(jié)果合并到你的項(xiàng)目中,請完成以下操作

新林網(wǎng)站制作公司哪家好,找創(chuàng)新互聯(lián)!從網(wǎng)頁設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、響應(yīng)式網(wǎng)站建設(shè)等網(wǎng)站項(xiàng)目制作,到程序開發(fā),運(yùn)營維護(hù)。創(chuàng)新互聯(lián)成立于2013年到現(xiàn)在10年的時間,我們擁有了豐富的建站經(jīng)驗(yàn)和運(yùn)維經(jīng)驗(yàn),來保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選創(chuàng)新互聯(lián)。
- 使用 Angular CLI 構(gòu)建項(xiàng)目的可分發(fā)文件的副本
- 使用 ?
"localize"? 選項(xiàng)將所有 i18n 消息替換為有效的翻譯并構(gòu)建本地化的應(yīng)用程序變體。應(yīng)用程序變體就是為單個語言環(huán)境翻譯的應(yīng)用程序的可分發(fā)文件的完整副本。
合并翻譯后,可使用服務(wù)器端語言檢測或不同的子目錄來提供(serve)應(yīng)用程序的每個可分發(fā)副本。
對于應(yīng)用程序的編譯期轉(zhuǎn)換,構(gòu)建過程會使用預(yù)先 (AOT) 編譯來生成小型、快速、可立即運(yùn)行的應(yīng)用程序。
要為每個語言環(huán)境構(gòu)建應(yīng)用程序的單獨(dú)可分發(fā)副本,請?jiān)陧?xiàng)目的 ?angular.json? 工作區(qū)構(gòu)建配置文件中在構(gòu)建配置中定義語言環(huán)境。
此方法不需要為每個語言環(huán)境執(zhí)行完整的應(yīng)用程序構(gòu)建,從而縮短了構(gòu)建過程。
要為每個語言環(huán)境生成應(yīng)用程序變體,請使用 ?angular.json? 工作區(qū)構(gòu)建配置文件中的 ?"localize"? 選項(xiàng)。此外,要從命令行構(gòu)建,請使用帶有 ?--localize? 選項(xiàng)的 ?build ?Angular CLI 命令。
或者,僅對一種語言環(huán)境應(yīng)用特定構(gòu)建選項(xiàng) 以自定義語言環(huán)境配置。
在構(gòu)建配置中定義語言環(huán)境
使用項(xiàng)目的工作區(qū)構(gòu)建配置文件 ?angular.json? 中的 ?i18n ?項(xiàng)目選項(xiàng)來定義項(xiàng)目的語言環(huán)境。
以下子選項(xiàng)標(biāo)識源語言并告訴編譯器在哪里可以找到項(xiàng)目支持的翻譯。
|
子選項(xiàng) |
詳情 |
|---|---|
sourceLocale |
你在應(yīng)用程序源代碼中使用的語言環(huán)境(默認(rèn)為 |
locales |
語言環(huán)境標(biāo)識符到翻譯文件的映射表 |
angular.json 用于 en-US 和 fr 示例
比如,工作區(qū)構(gòu)建配置文件 ?angular.json? 的以下代碼片段會將源語言環(huán)境設(shè)置為 ?en-US? 并提供法語 ( ?fr? ) 語言環(huán)境翻譯文件的路徑。
"projects": {
"angular.io-example": {
// ...
"i18n": {
"sourceLocale": "en-US",
"locales": {
"fr": {
"translation": "src/locale/messages.fr.xlf",
// ...
}
}
},
"architect": {
// ...
}
}
}
}為每個語言環(huán)境生成應(yīng)用程序變體
要在構(gòu)建配置中使用你的語言環(huán)境定義,請使用工作空間構(gòu)建配置文件 ?angular.json? 中的 ?"localize"? 選項(xiàng)來告訴 CLI 要為此構(gòu)建配置生成哪些語言環(huán)境。
- 對于先前在構(gòu)建配置中定義的所有語言環(huán)境,將 ?
"localize"? 設(shè)置為 ?true?。 - 將 ?
"localize"? 設(shè)置為先前定義的語言環(huán)境標(biāo)識符子集的數(shù)組,以單獨(dú)構(gòu)建那些語言環(huán)境版本。 - 將 ?
"localize"? 設(shè)置為 ?false?以禁用本地化并且不生成任何特定于語言環(huán)境的版本。
注意:
本地化組件模板需要
預(yù)先 (AOT) 編譯。
如果你更改了此設(shè)置,請將 ?
"aot"? 設(shè)置為 ?
true?以使用 AOT。
由于 i18n 的部署復(fù)雜性和最小化重建時間的需要,開發(fā)服務(wù)器一次僅支持本地化單個語言環(huán)境。如果你將 ?
"localize"? 選項(xiàng)設(shè)置為 ?true?,定義了多個語言環(huán)境,并使用 ?ng serve?,就會發(fā)生錯誤。如果要針對特定語言環(huán)境進(jìn)行開發(fā),請將 ?"localize"? 選項(xiàng)設(shè)置為特定的語言環(huán)境。比如,對于法語 ( ?fr?),請指定 ?"localize": ["fr"]?。
CLI 加載并注冊語言環(huán)境數(shù)據(jù),將每個生成的版本放置在特定語言環(huán)境的目錄中以使其與其他語言環(huán)境版本分開,并將其目錄放在為此項(xiàng)目配置的 ?outputPath ?中。對于每個應(yīng)用程序變體,將 ?html ?元素的 ?lang ?屬性設(shè)置為其語言環(huán)境。CLI 還通過將語言環(huán)境添加到所配置的 ?baseHref ?中來調(diào)整每個應(yīng)用程序版本的 HTML baseHref。
將 ?"localize"? 屬性設(shè)置為共享配置以有效繼承所有配置。此外,會將該屬性設(shè)置為覆蓋其他配置。
angular.json 包含構(gòu)建示例中的所有語言環(huán)境
以下示例展示了如何把工作區(qū)構(gòu)建配置文件 ?angular.json? 中的 ?"localize"? 選項(xiàng)設(shè)置為 ?true?,以構(gòu)建構(gòu)建配置中定義的所有語言環(huán)境。
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"localize": true,
// ...
},從命令行構(gòu)建
此外,可以將 ?--localize? 選項(xiàng)與 ?ng build? 命令和你現(xiàn)有的 ?production ?配置結(jié)合使用。CLI 會構(gòu)建配置中定義的所有語言環(huán)境。如果在構(gòu)建配置中設(shè)置了語言環(huán)境,則相當(dāng)于將 ?"localize"? 選項(xiàng)設(shè)置為 ?true?。
ng build --localize僅對一種語言環(huán)境應(yīng)用特定的構(gòu)建選項(xiàng)
要將特定構(gòu)建選項(xiàng)僅應(yīng)用于一個語言環(huán)境,請指定單個語言環(huán)境以創(chuàng)建自定義的語言環(huán)境專有配置。
請使用只有一個語言環(huán)境的 Angular CLI 開發(fā)服務(wù)器 ( ?
ng serve? )。
為法語構(gòu)建的例子
以下示例顯示使用單個語言環(huán)境的自定義語言環(huán)境專屬配置。
"build": {
// ...
"configurations": {
// ...
"fr": {
"localize": ["fr"]
}
},
// ...
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
// ...
"fr": {
"browserTarget": "angular.io-example:build:development,fr"
}
},
// ...
},
// ...
}將此配置傳遞給 ?ng serve? 或 ?ng build? 命令。以下代碼示例顯示了如何提供法語文件。
ng serve --configuration=fr對于生產(chǎn)構(gòu)建,可使用配置組合來同時運(yùn)行這兩種配置。
ng build --configuration=production,fr"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
// ...
},
"configurations": {
// ...
"fr": {
"localize": ["fr"]
}
},
// ...
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"browserTarget": "angular.io-example:build:production"
},
// ...
"fr": {
"browserTarget": "angular.io-example:build:development,fr"
}
},
// ...
},
// ...
}報告缺失的翻譯
當(dāng)缺少翻譯時,可以構(gòu)建成功但會生成警告,比如 ?Missing translation for message "{translation_text}"?。要配置 Angular 編譯器生成的警告級別,請指定以下級別之一。
|
警告級別 |
詳情 |
輸出 |
|---|---|---|
error |
拋出錯誤,構(gòu)建失敗 |
不適用 |
ignore |
什么也不做 |
不適用 |
warning |
在控制臺或 shell 中顯示默認(rèn)警告 |
Missing translation for message "{translation_text}" |
在工作區(qū)構(gòu)建配置文件 ?angular.json? 中 ?build ?目標(biāo)的 ?options ?部分指定警告級別。
angular.json error 警告級別示例
以下示例顯示如何將警告級別設(shè)置為 ?error?。
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
// ...
"i18nMissingTranslation": "error"
},當(dāng)你將 Angular 項(xiàng)目編譯為 Angular 應(yīng)用程序時,?
i18n? 屬性的實(shí)例將被替換為 ?
$localize? 標(biāo)記的消息字符串的實(shí)例。這意味著你的 Angular 應(yīng)用程序會在編譯后被翻譯。這也意味著你可以創(chuàng)建 Angular 應(yīng)用程序的本地化版本,而無需為每個語言環(huán)境重新編譯整個 Angular 項(xiàng)目。
當(dāng)你翻譯 Angular 應(yīng)用程序時,
翻譯轉(zhuǎn)換會用翻譯集合中的字符串替換和重新排序模板文字字符串的部分(靜態(tài)字符串和表達(dá)式)。
名稱欄目:創(chuàng)新互聯(lián)Angular教程:Angular將翻譯合并到應(yīng)用中
文章網(wǎng)址:http://www.dlmjj.cn/article/djjiepg.html


咨詢
建站咨詢
