Angular Common - Utils - localization

An object that serves as a namespace for the methods that are used to localize an application.

See Also

formatDate(value, format)

Converts a Date object to a string using the specified format.

import { formatDate } from "devextreme/localization"
Parameters:
value:

Date

A Date object to be converted.

format:

Format

The format to be used for conversion.

Return Value:

String

The formatted string.

jQuery
JavaScript
var dateString = DevExpress.localization.formatDate(new Date(2018, 4, 7), "longDate");
console.log(dateString); // logs "Monday, May 7, 2018"
Angular
TypeScript
import { formatDate } from "devextreme/localization";
// ...
export class AppComponent {
    constructor() {
        let dateString = formatDate(new Date(2018, 4, 7), "longDate");
        console.log(dateString); // logs "Monday, May 7, 2018"
    }
}

formatMessage(key, value)

Substitutes the provided value(s) for placeholders in a message that the key specifies.

import { formatMessage } from "devextreme/localization"
Parameters:
key:

String

The key that identifies the message in a dictionary.

value:

String

|

Array<String>

One or several values used to fill placeholders in the message.

Return Value:

String

The formatted message.

jQuery
JavaScript
// Load the "greeting" message for the "en" and "es" locales
DevExpress.localization.loadMessages({
    "en": {
        "greeting": "Hello, {0} {1}!",
    },
    "es": {
        "greeting": "Hola, {0} {1}!",
    }
});

// Set the current locale to "en"
DevExpress.localization.locale("en");
console.log(DevExpress.localization.formatMessage("greeting", ["John", "Smith"])); // logs "Hello, John Smith!"

// Set the current locale to "es"
DevExpress.localization.locale("es");
console.log(DevExpress.localization.formatMessage("greeting", ["John", "Smith"])); // logs "Hola, John Smith!"
Angular
TypeScript
import { formatMessage, loadMessages, locale } from "devextreme/localization";
// ...
export class AppComponent {
    constructor() {
        // Load the "greeting" message for the "en" and "es" locales
        loadMessages({
            "en": {
                "greeting": "Hello, {0} {1}!",
            },
            "es": {
                "greeting": "Hola, {0} {1}!",
            }
        });

        // Set the current locale to "en"
        locale("en");
        console.log(formatMessage("greeting", ["John", "Smith"])); // logs "Hello, John Smith!"

        // Set the current locale to "es"
        locale("es");
        console.log(formatMessage("greeting", ["John", "Smith"])); // logs "Hola, John Smith!"
    }
}

formatNumber(value, format)

Converts a numeric value to a string using the specified format.

import { formatNumber } from "devextreme/localization"
Parameters:
value:

Number

A numeric value to be converted.

format:

Format

The format to be used for conversion.

Return Value:

String

The formatted string.

jQuery
JavaScript
var numberString = DevExpress.localization.formatNumber(0.25, "percent");
console.log(numberString); // logs "25%"
Angular
TypeScript
import { formatNumber } from "devextreme/localization";
// ...
export class AppComponent {
    constructor() {
        let numberString = formatNumber(0.25, "percent");
        console.log(numberString); // logs "25%"
    }
}

loadMessages(messages)

Loads localized messages.

import { loadMessages } from "devextreme/localization"
Parameters:
messages:

Object

The messages to be loaded.

jQuery
JavaScript
DevExpress.localization.loadMessages({
    "en": {
        "Yes": "Yes",
        "No": "No",
        // ...
    },
    "es": {
        "Yes": "Si",
        "No": "No",
        // ...
    }
});
Angular
TypeScript
import { loadMessages } from "devextreme/localization";
// ...
export class AppComponent {
    constructor() {
        loadMessages({
            "en": {
                "Yes": "Yes",
                "No": "No",
                // ...
            },
            "es": {
                "Yes": "Si",
                "No": "No",
                // ...
            }
        });
    }
}
NOTE
It is necessary to reload the page each time you load new messages.

locale()

Gets the current locale identifier.

import { locale } from "devextreme/localization"
Return Value:

String

The identifier.

See Also

locale(locale)

Sets the current locale identifier.

import { locale } from "devextreme/localization"
Parameters:
locale:

String

The required locale identifier.

NOTE
This method should be called only once - at the application's launch. It is necessary to reload the page each time you need to set new locale.
See Also

parseDate(text, format)

Parses a string into a Date object.

import { parseDate } from "devextreme/localization"
Parameters:
text:

String

A string value to be parsed.

format:

Format

The format of the string to be parsed.

Return Value:

Date

A Date object equivalent to the specified string.

parseNumber(text, format)

Parses a string into a numeric value.

import { parseNumber } from "devextreme/localization"
Parameters:
text:

String

A string value to be parsed.

format:

Format

The format of the string to be parsed.

Return Value:

Number

A numeric value equivalent to the specified string.