aliyun-naza-l20n

依赖于l20n

l20n的简单介绍

html绑定

加载语言以及js文件

<meta name="defaultLanguage" content="en-US">
<meta name="availableLanguages" content="de, en-US, fr, pl">
<link rel="localization" href="locales/myApp.{locale}.json">
<script defer src="dist/compat/web/l20n.js"></script>

1. 通过data-*形式来定义id，把id描述和DOM绑定起来 <h1 data-l10n-id="hello" data-l10n-args='{"username": "Mary"}'></h1>
2. 首次加载语言成功，会触发document.l10n.ready的resolve会被调用，即可以通过document.l10n.ready.then注入首次加载成功的回调
3. 当切换语言，document会触发DOMRetranslated事件

view

1. ready，首次加载成功，相当于ctx.once。
2. requestLanguages(langs: Array)，请求语言文件
3. formatValue(id: String, args: Object): Promise, 更新指定ID描述，替换argss内容。
4. formatValues(keys: Array) 更新多条描述
5. setAttributes(elem: DOM, id: String, args: Object),js绑定dom和id描述
6. getAttributes(elem: DOM) 获取id描述
7. translateFragment(frag: DOM)更新片段中的所有语言描述内容

node

一般来说，通过html的绑定，已经view的使用，可以方便的实现国际化，但是如果想省去meta、link标签等，再或者想封装l20n的一些业务处理逻辑时，可以使用到node的方式手动调用。

import { Env, fetchResource } from 'l20n';
const env = new Env('en-US', fetchResource);
const ctx = env.createContext(['locales/{locale}.l20n']);
const langs = [
  {code: 'es-ES'},
  {code: 'en-US'}
];
ctx.resolveValues(langs, ['foo', 'bar']).then(
  ([foo, bar]) => console.log(foo, bar));

naza-l20n的使用

1. 提供l20n服务以及data-l20n指令

• data-l20n和data-l20n-args用于取代以上的data-l10n-id和data-l10n-args
• 在js中调用l20n.update(key, args), 指定的data-l20n指令会重新更新语言文本。
• 当data-l20n的key值更新时，该指令会重新更新语言文本。
• 当data-l20n和data-l20n-args的值改变时，会自动触发更新指令的语言文本。

1. l20n服务的方法

• update(key [,args]) 更新指定key所对应的指令的语言文本
• changeLocale(lang) 切换语言
• get(key<String|Array> [, args]) 获取key对应的语言文本，当key是数组时，可以获取多个语言文本，格式为[[key, args], [key, args]]
• data() 获取所有的原始语言文本（其中的变量仍然存在）
• parse(str [, args]) 原始的语言文本插值替换（也可以自行通过$interpolate实现)

1. 通过$rootScope.ngL20nLocale可以访问到当前的语言

release 0.1.4

以l20n-common.js为核心库，同时l20n-common也存在一点小问题：

1. FSI、PDI为unicode，web端解析不了
2. 其他要开发的模块还依赖于内部的pseudo，但l20n-common并没有开放出来。

！所以解决版本就是通过exports-loader来更改FSI和PDI为''；通过开放出来pseudo。

本期开放2个版本的L20n：（基于requireJS的版本还有待开发）

1. 基于web原生的l20n-navtive.js，通过require('l20n/dist/native/1.0.0/l20n')
2. 基于angular的l20n-ng.js，通过require('l20n/dist/ng/1.0.0/l20n')
3. 统一开放的API如下：

对于native，通过document.l20n调用，而angular版本通过l20n service来调用

update(key:String, args: Object)      更新指定标签的文案
changeLanguage(lang: String)          切换语言
ready(fn: Function)                   在语言切换成功后的做回调
hasReady()                            判断语言加载是否成功
get(key:String, args: Object)         获取指定的文案（可能获取不到返回undefined）
getAsync(key:String, args: Object)    以异步方式获取指定文案（安全做法）
parse(entity:Object, args: Object)    解析出具体文案
getNS(key:String, args: Object)       获取某类文案（基于模块化开发时特别有用）
getNSAsync(key:String, args: Object)  异步方式调用

release 0.1.5

1. 修复document.hasReady() 为 l20nService.hasReady()

release 0.1.6

1. 更新l20n-native.js，提供和l20n-ng的api
2. 提取l20nContext.js和api.js，其中api.js是api的方法公共部分。
3. 补充了demo

release 0.1.7

1. 修复getNS方法，默认返回的是json，除非getNS(id, args, paralle)返回的是数组

release 0.1.8

1. 修复首次请求语言navigator.languages，当window.name包含DEFER_LANGUAGE!则会根据meta['name="defaultLanguage"']来请求默认语言。

release 0.1.9

1. 修复l20n-ng指令，对dom结构手动加入时，不如对话框，指令生效时需要更新文案

release 0.1.10

1. 修复国际化js打包ES6降ES5处理

参考：

http://l20n.org/ https://developer.mozilla.org/zh-CN/docs/Mozilla/Projects/L20n http://www.w3.org/International/tests/repo/results/rli-etc