Kendo UI Internationalization

This repository contains the source code and documentation of the Kendo UI Internationalization package.

It includes methods for parsing and formatting dates and numbers by using Unicode Common Locale Data Repository (CLDR) data. These methods are split into the following modules:

• CLDR
• Date Parsing
• Date Formatting
• Number Parsing
• Number Formatting
• General Formatting

Basic Usage

CLDR Data

To use the Unicode® CLDR data, you need to install the following subset of cldr-json packages by running the following command:

1npm install --save cldr-core cldr-dates-full cldr-numbers-full

To apply the methods for different locales, load the likelySubtags and the locale data by using the load method.

Additionally, the library requires you to load:

• The supplemental currencyData for the default currency formatting.
• The weekData for the day of week formatting.

1import { load } from '@progress/kendo-intl';
2
3load(
4    require('cldr-core/supplemental/likelySubtags.json'),
5    require('cldr-core/supplemental/currencyData.json'),
6    require('cldr-core/supplemental/weekData.json'),
7
8    require('cldr-numbers-full/main/bg/numbers.json'),
9    require('cldr-numbers-full/main/bg/currencies.json'),
10
11    require('cldr-dates-full/main/bg/dateFields.json'),
12    require('cldr-dates-full/main/bg/ca-gregorian.json'),
13    require('cldr-dates-full/main/bg/timeZoneNames.json')
14);

For more examples and available configuration options, refer to the article on CLDR Data.

Date Parsing

Date parsing converts a string into a Date object by using the specific settings of the locale.

1import { parseDate } from '@progress/kendo-intl';
2
3parseDate("11/6/2000", ["G", "d"]); // Mon Nov 06 2000
4parseDate("Montag, 6.11.2000", "EEEE, d.MM.y", "de"); // Mon Nov 06 2000
5parseDate("2000-11-06T10:30Z"); // Mon Nov 06 2000 12:30

For more examples and available configuration options, refer to the article on date parsing.

Date Formatting

Date formatting converts a Date object into a human-readable string by using the specific settings of the locale.

1import { formatDate } from '@progress/kendo-intl';
2
3formatDate(new Date(2000, 10, 6), "d"); // 11/6/2000
4formatDate(new Date(2000, 10, 6), "yMd", "de"); // 6.11.2000
5formatDate(new Date(2000, 10, 6), "EEEE, d.MM.y", "bg"); // понеделник, 6.11.2000

For more examples and available configuration options, refer to the article on date formatting.

Number Parsing

Number parsing converts a string into a Number object by using the specific settings of the locale.

1import { parseNumber } from '@progress/kendo-intl';
2
3parseNumber("12.22"); // 12.22
4parseNumber("1.212,22 €", "de"); // 1212.22
5parseNumber("10.22 %"); // 0.1022
6parseNumber("1,0000123e+4", "bg"); // 10000.123

For more examples and available configuration options, refer to the article on number parsing.

Number Formatting

Number formatting converts a Number object into a human-readable string using the specific settings of the locale.

1import { formatNumber } from '@progress/kendo-intl';
2
3formatNumber(1234.567, "n2"); // 1,234.57
4
5formatNumber(1234.567, "c", "de"); // 1.234,57 €
6
7formatNumber(1234.567, {
8   style: "currency",
9   currency: "USD",
10   currencyDisplay: "displayName"
11}, "bg"); // 1 234,57 щатски долара
12
13formatNumber(2345678, "##,#.00"); // 2,345,678.00

For more examples and available configuration options, refer to the article on number formatting.

General Formatting

General formatting provides methods for independent placeholder and type formatting by using the specific settings of the locale.

1import { format, toString } from '@progress/kendo-intl';
2
3format('Date: {0:d} - Price: {1:c}', [new Date(), 10.5], "en") // Date: 1/5/2017 - Price: $10.50
4
5toString(10.5, "c", "bg"); // 10,50 лв.
6
7toString(new Date(), "d"); // 1/5/2017

For more examples and available configuration options, refer to the article on general formatting.

Installation

1. The Internationalization library is published as a scoped NPM package in the NPMJS Telerik account.

2. Download and install the module:

   1npm install --save '@progress/kendo-intl';

3. Once installed, import the Internationalization in your application root module:

   1// ES2015 module syntax
   2import { formatDate, parseDate } from '@progress/kendo-intl';
   3//or
   4import { formatNumber, parseNumber } from '@progress/kendo-intl';

   1// CommonJS format
   2var numbers = require('@progress/kendo-intl/number').numbers;
   3//or
   4var dates = require('@progress/kendo-intl/dates').dates;