# Parsing and Formatting of Dates and Numbers

The Kendo UI Internationalization package for Angular utilizes the [Kendo UI Internationalization modules](https://github.com/telerik/kendo-intl/tree/master#readme) for date and number parsing and formatting, and builds on top of them to adapt them to the Angular context.

For more information on parsing and formatting date and number options, refer to the [kendo-intl](https://github.com/telerik/kendo-intl/tree/master#readme) GitHub repository.

## Modules for Date and Number Operations

The available internationalization methods are based on the [Unicode Common Locale Data Repository (CLDR)](http://cldr.unicode.org/) data and are split into the following modules:

* [Load Locales](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#loading-locales)
* [Date parsing](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#date-parsing)
* [Date formatting](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#date-formatting)
* [Number parsing](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#number-parsing)
* [Number formatting](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#number-formatting)
* [General formatting](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#general-formatting)

### Loading Locales

To load the required locale use one of the following approaches:

* [Using pre-built locales](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#using-pre-built-locales)
* [Using CLDR-JSON Data](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/parsing-and-formatting#using-cldr-json-data)

#### Using Pre-Built Locales

This package provides pre-built locales which are generated from the [Unicode® CLDR](https://cldr.unicode.org/) and simplify the loading of the requested data.

> The pre-built locale data in the kendo-angular-intl package might be outdated with respect to the current CLDR release.

To load a pre-built locale, import its module(s) using the following template:

```js
import '@progress/kendo-angular-intl/locales/{locale-name}/{locale-part}';
```

The `locale-name` of the previous example can be any available locale, for example, `bg`, `de`, or `fr`.

The `locale-part` indicates which part of the locale will be loaded and can be any of the following:

* `all`
* `calendar`
* `currencies`
* `numbers`

The following example demonstrates how to load the full Bulgarian (`bg`) locale data and the German (`de`) calendar information.

```js
// Load all required data for the bg locale.
import '@progress/kendo-angular-intl/locales/bg/all';

// Load the required calendar data for the de locale.
import '@progress/kendo-angular-intl/locales/de/calendar';
```

#### Using CLDR-JSON Data

The [cldr-json](https://github.com/unicode-org/cldr-json) project is the reference source of data for all locales. Compared to the usage of the pre-built locales in your project, the usage of the cldr-json packages is more demanding because it requires you to load the data from JSON files.

To use the CLDR-JSON data, install the following subset of CLDR-JSON packages:

```sh
npm 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`](https://github.com/telerik/kendo-intl/blob/master/docs/cldr/api.md#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.

```js
import { load } from '@progress/kendo-angular-intl';

load(
    require('cldr-core/supplemental/likelySubtags.json'),
    require('cldr-core/supplemental/currencyData.json'),
    require('cldr-core/supplemental/weekData.json'),

    require('cldr-numbers-full/main/bg/numbers.json'),
    require('cldr-numbers-full/main/bg/currencies.json'),

    require('cldr-dates-full/main/bg/dateFields.json'),
    require('cldr-dates-full/main/bg/ca-gregorian.json'),
    require('cldr-dates-full/main/bg/timeZoneNames.json')
);
```

### Date Parsing

Date parsing converts a string into a `Date` object by using the specific settings of the locale. For more information on date parsing, refer to the `kendo-intl` [Date Parsing section](https://github.com/telerik/kendo-intl/blob/develop/docs/date-parsing/index.md).

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/globalization/internationalization/parsing/date/source.txt)

### Date Formatting

Date formatting converts a `Date` object into a human-readable string by using the specific settings of the locale. For more information on date formatting, refer to the `kendo-intl` [Date Formatting section](https://github.com/telerik/kendo-intl/blob/develop/docs/date-formatting/index.md).

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/globalization/internationalization/formatting/date/source.txt)

### Number Parsing

Number parsing converts a string into a `Number` object by using the specific settings of the locale. For more information on number parsing, refer to the `kendo-intl` [Number Parsing section](https://github.com/telerik/kendo-intl/blob/develop/docs/num-parsing/index.md).

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/globalization/internationalization/parsing/number/source.txt)

### Number Formatting

Number formatting converts a `Number` object into a human-readable string using the specific settings of the locale. For more information on number formatting, refer to the `kendo-intl` [Number Formatting section](https://github.com/telerik/kendo-intl/blob/develop/docs/num-formatting/index.md).

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/globalization/internationalization/formatting/number/source.txt)

### General Formatting

General formatting provides methods for independent placeholder and type formatting by using the specific settings of the locale. For more information on general formatting, refer to the `kendo-intl` [General Formatting section](https://github.com/telerik/kendo-intl/blob/develop/docs/general-formatting/index.md).

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/globalization/internationalization/formatting/general/source.txt)

## Suggested Links

* [kendo-intl GitHub Repository](https://github.com/telerik/kendo-intl/tree/master/docs)
* [IntlService API Reference](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/api/intlservice)
* [CldrIntlService API Reference](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/api/cldrintlservice)
* [Troubleshooting](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/troubleshooting)
* [API Index of the Internationalization](https://www.telerik.com/kendo-angular-ui-develop/components/globalization/internationalization/api)
