Компания Taucraft
{gender, select,
male {He}
female {She}
other {They}
} will respond shortly.
You have {itemCount, plural,
=0 {no items}
one {1 item}
other {{itemCount} items}
}.
ordinal | one | 1, 21, 31, 41, 51, 61, 71, 81, 101, 1001, … | Take the 1st right. |
two | 2, 22, 32, 42, 52, 62, 72, 82, 102, 1002, … | Take the 2nd right. | |
few | 3, 23, 33, 43, 53, 63, 73, 83, 103, 1003, … | Take the 3rd right. | |
other | 0, 4~18, 100, 1000, 10000, 100000, 1000000, … | Take the 4th right. |
ordinal | other | 0~15, 100, 1000, 10000, 100000, 1000000, … | Сверните направо на 15-м перекрестке. |
var collator = new Intl.Collator();
console.log(collator.compare('a', 'c')); // → отрицательное значение
console.log(collator.compare('c', 'a')); // → положительное значение
console.log(collator.Collator().compare('a', 'a')); // → 0
// В немецком буква ä идёт рядом с буквой a
console.log(new Intl.Collator('de').compare('ä', 'z'));
// → отрицательное значение
// В шведском буква ä следует после буквы z
console.log(new Intl.Collator('sv').compare('ä', 'z'));
// → положительное значение
var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
// Форматирование ниже предполагает, что местный часовой пояс равен
// America/Los_Angeles для локали США
// В американском английском используется порядок месяц-день-год
console.log(new Intl.DateTimeFormat('en-US').format(date));
// → "12/19/2012"
// В британском английском используется порядок день-месяц-год
console.log(new Intl.DateTimeFormat('en-GB').format(date));
// → "20/12/2012"
// В корейском используется порядок год-месяц-день
console.log(new Intl.DateTimeFormat('ko-KR').format(date));
// → "2012. 12. 20."
var number = 123456.789;
// В Германии в качестве разделителя целой и дробной части используется запятая,
// а в качестве разделителя разрядов - точка
console.log(new Intl.NumberFormat('de-DE').format(number));
// → 123.456,789
// В России в качестве разделителя целой и дробной части используется запятая,
//а в качестве разделителя разрядов - пробел
console.log(new Intl.NumberFormat('ru-RU').format(number));
// → 123 456,789
// В большинстве арабоговорящих стран используют настоящие арабские цифры
console.log(new Intl.NumberFormat('ar-EG').format(number));
// → ١٢٣٤٥٦٫٧٨٩
var number = 123456.789;
// Запрашиваем формат валюты
console.log(new Intl.NumberFormat('de-DE',
{ style: 'currency', currency: 'EUR' }).format(number)
);
// → 123.456,79 €
console.log(new Intl.NumberFormat('en-IN',
{ style: 'currency', currency: 'EUR' }
).format(number));
// → €123,456.79
var english = new IntlRelativeFormat('en-US');
var russian = new IntlRelativeFormat('en-US');
var post = {
id : 1,
title: 'Some Blog Post',
date : new Date(1426271670524)
};
console.log(english.format(post.date)); // => "3 hours ago"
console.log(russian.format(post.date)); // => "3 часа назад"
Но есть полифил Intl.js
{
direction: ltr;
}
{
unicode-bidi:bidi-override;
direction: rtl;
}
{
writing-mode:vertical-lr
}
.example {
display:inline-block;
padding:5px 10px 15px 20px;
margin:5px 10px 15px 20px;
border-style:dotted dashed double solid;
border-width:1px 2px 3px 4px;
border-color:red green blue black;
box-shadow: -1em 0 0.4em gray, 3px 3px 30px black;
}
→
.example {
display:inline-block;
padding:5px 20px 15px 10px;
margin:5px 20px 15px 10px;
border-style:dotted solid double dashed;
border-width:1px 4px 3px 2px;
border-color:red black blue green;
box-shadow: 1em 0 0.4em gray, -3px 3px 30px black;
}
var locale = 'ru';
localize(keys.hello, locale);
var dict = {
ru: {
hello:'Привет, мир'
},
default: {
hello:'Hello world'
}
};
var dict = {
'greeting.message':'Hello world'
};
var message = __('greeting.message');
var message = __('Hello world');
/**
Метод ищет фразу в некотором dict,
если не нашел возвращает оригинальную фразу
**/
<span class="ui-label-remain ui-progressbar__data__remain">
<%= fn.intl.formatHTMLMessage('Remain {timeRemain}',
{
timeRemain: '<b class="value">' + this.timeRemain + 'h</b>'
}
) %>
</span>
<FormattedMessage message="Action required"/>
var tooltipTextMap = {
'board': intl.formatMessage('Make this View visible…'),
'group': intl.formatMessage('Make this Group visible…')
};
Работает на регулярных выражения и любви. Для jsx используется AST parser.
// intlScope:'customScope'
<!--intlScope:customScope-->
{
"menu":["group"],
"users":["group"]
}
var response = {
message: "You add {count} user story.",
data: {count: 10}
}
intl.formatMessage(response.message, data);
// You add 10 user story.
loadPolyfillAndDictionary(currentLocale)
.then(
()=> {
initApp();
}
)
{
"dependencies": {
"dictionary": "1.100.1"
}
}
Было бы хорошо, если бы все фразы были простыми строками.
_.escape('<script> alert("Ха") </script> полезная фраза');
// все хорошо
<b>Attention!</b> Remove this task?
<b>Внимание!</b> Удалить эту задачу?
<script>
alert("Ха")
// XSS во фразе с форматированием
</script>
<b>Click me!</b> Remove this task?
<b>Кликни меня!</b> Удалить эту задачу?
<script>
alert("Ха");
// XSS, нужно навесить событие на элемент
</script>
<b class="i-role-action">Кликни меня!</b>
// В коде приложении навешиваем событие
<script>
$(".i-role-action").click(()=>{action();})
</script>
<FormattedMessage
message={"{name} has {numPhotos}"}
name={<MyComponent>Annie</MyComponent>}
numPhotos={1000}
/>
Поможет инструментация кода.
formatMessage(stringFromDictionary +
'<script>window.XSS++</script>'
)
Не используйте флаги для выбора языков, пишите названия язык на целевом языке пользователя.