@angular/common

  • Version 12.0.3
  • Published
  • 12.3 MB
  • 1 dependency
  • MIT license

Install

npm i @angular/common
yarn add @angular/common
pnpm add @angular/common

Overview

Angular - commonly needed directives and services

Index

Variables

Functions

Classes

Interfaces

Enums

Type Aliases

Variables

variable APP_BASE_HREF

const APP_BASE_HREF: any;
  • A predefined [DI token](guide/glossary#di-token) for the base href to be used with the PathLocationStrategy. The base href is the URL prefix that should be preserved when generating and recognizing URLs.

    The following example shows how to use this token to configure the root app injector with a base href value, so that the DI framework can supply the dependency anywhere in the app.

    import {Component, NgModule} from '@angular/core';
    import {APP_BASE_HREF} from '@angular/common';
    @NgModule({
    providers: [{provide: APP_BASE_HREF, useValue: '/my/app'}]
    })
    class AppModule {}

variable DOCUMENT

const DOCUMENT: any;
  • A DI Token representing the main rendering context. In a browser this is the DOM Document.

    Note: Document might not be available in the Application Context when Application and Rendering Contexts are not the same (e.g. when running the application in a Web Worker).

variable LOCATION_INITIALIZED

const LOCATION_INITIALIZED: any;
  • Indicates when a location is initialized.

variable ɵangular_packages_common_common_e

const ɵangular_packages_common_common_e: any[];
  • A collection of Angular directives that are likely to be used in each and every Angular application.

variable ɵangular_packages_common_common_f

const ɵangular_packages_common_common_f: (
| typeof AsyncPipe
| typeof SlicePipe
| typeof DecimalPipe
| typeof PercentPipe
| typeof CurrencyPipe
| typeof DatePipe
| typeof I18nPluralPipe
| typeof I18nSelectPipe
| typeof KeyValuePipe
)[];
  • A collection of Angular pipes that are likely to be used in each and every application.

variable ɵPLATFORM_BROWSER_ID

const ɵPLATFORM_BROWSER_ID: string;

    variable ɵPLATFORM_SERVER_ID

    const ɵPLATFORM_SERVER_ID: string;

      variable ɵPLATFORM_WORKER_APP_ID

      const ɵPLATFORM_WORKER_APP_ID: string;

        variable ɵPLATFORM_WORKER_UI_ID

        const ɵPLATFORM_WORKER_UI_ID: string;

          variable VERSION

          const VERSION: any;

          Functions

          function formatCurrency

          formatCurrency: (
          value: number,
          locale: string,
          currency: string,
          currencyCode?: string,
          digitsInfo?: string
          ) => string;
          • CommonModule

            Formats a number as currency using locale rules.

            Parameter value

            The number to format.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter currency

            A string containing the currency symbol or its name, such as "$" or "Canadian Dollar". Used in output string, but does not affect the operation of the function.

            Parameter currencyCode

            The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) currency code, such as USD for the US dollar and EUR for the euro. Used to determine the number of digits in the decimal part.

            Parameter digitsInfo

            Decimal representation options, specified by a string in the following format: {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. See DecimalPipe for more details.

            Returns

            The formatted currency value.

            See Also

            • formatNumber()

            • DecimalPipe

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function formatDate

          formatDate: (
          value: string | number | Date,
          format: string,
          locale: string,
          timezone?: string
          ) => string;
          • CommonModule

            Formats a date according to locale rules.

            Parameter value

            The date to format, as a Date, or a number (milliseconds since UTC epoch) or an [ISO date-time string](https://www.w3.org/TR/NOTE-datetime).

            Parameter format

            The date-time components to include. See DatePipe for details.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter timezone

            The time zone. A time zone offset from GMT (such as '+0430'), or a standard UTC/GMT or continental US time zone abbreviation. If not specified, uses host system settings.

            Returns

            The formatted date string.

            See Also

            • DatePipe

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function formatNumber

          formatNumber: (value: number, locale: string, digitsInfo?: string) => string;
          • CommonModule

            Formats a number as text, with group sizing, separator, and other parameters based on the locale.

            Parameter value

            The number to format.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter digitsInfo

            Decimal representation options, specified by a string in the following format: {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. See DecimalPipe for more details.

            Returns

            The formatted text string.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function formatPercent

          formatPercent: (value: number, locale: string, digitsInfo?: string) => string;
          • CommonModule

            Formats a number as a percentage according to locale rules.

            Parameter value

            The number to format.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter digitsInfo

            Decimal representation options, specified by a string in the following format: {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. See DecimalPipe for more details.

            Returns

            The formatted percentage value.

            See Also

            • formatNumber()

            • DecimalPipe

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getCurrencySymbol

          getCurrencySymbol: (
          code: string,
          format: 'wide' | 'narrow',
          locale?: string
          ) => string;
          • Retrieves the currency symbol for a given currency code.

            For example, for the default en-US locale, the code USD can be represented by the narrow symbol $ or the wide symbol US$.

            Parameter code

            The currency code.

            Parameter format

            The format, wide or narrow.

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            The symbol, or the currency code if no symbol is available.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleCurrencyCode

          getLocaleCurrencyCode: (locale: string) => string | null;
          • Retrieves the default currency code for the given locale.

            The default is defined as the first currency which is still in use.

            Parameter locale

            The code of the locale whose currency code we want.

            Returns

            The code of the default currency for the given locale.

          function getLocaleCurrencyName

          getLocaleCurrencyName: (locale: string) => string | null;
          • Retrieves the name of the currency for the main country corresponding to a given locale. For example, 'US Dollar' for en-US.

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            The currency name, or null if the main country cannot be determined.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleCurrencySymbol

          getLocaleCurrencySymbol: (locale: string) => string | null;
          • Retrieves the symbol used to represent the currency for the main country corresponding to a given locale. For example, '$' for en-US.

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            The localized symbol character, or null if the main country cannot be determined.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleDateFormat

          getLocaleDateFormat: (locale: string, width: FormatWidth) => string;
          • Retrieves a localized date-value formating string.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter width

            The format type.

            Returns

            The localized formating string.

            See Also

            • FormatWidth

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleDateTimeFormat

          getLocaleDateTimeFormat: (locale: string, width: FormatWidth) => string;
          • Retrieves a localized date-time formatting string.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter width

            The format type.

            Returns

            The localized formatting string.

            See Also

            • FormatWidth

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleDayNames

          getLocaleDayNames: (
          locale: string,
          formStyle: FormStyle,
          width: TranslationWidth
          ) => ReadonlyArray<string>;
          • Retrieves days of the week for the given locale, using the Gregorian calendar.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter formStyle

            The required grammatical form.

            Parameter width

            The required character width.

            Returns

            An array of localized name strings. For example,[Sunday, Monday, ... Saturday] for en-US.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleDayPeriods

          getLocaleDayPeriods: (
          locale: string,
          formStyle: FormStyle,
          width: TranslationWidth
          ) => readonly [string, string];
          • Retrieves day period strings for the given locale.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter formStyle

            The required grammatical form.

            Parameter width

            The required character width.

            Returns

            An array of localized period strings. For example, [AM, PM] for en-US.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleDirection

          getLocaleDirection: (locale: string) => 'ltr' | 'rtl';
          • Retrieves the writing direction of a specified locale

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            'rtl' or 'ltr'

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleEraNames

          getLocaleEraNames: (
          locale: string,
          width: TranslationWidth
          ) => readonly [string, string];
          • Retrieves Gregorian-calendar eras for the given locale.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter width

            The required character width.

            Returns

            An array of localized era strings. For example, [AD, BC] for en-US.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleExtraDayPeriodRules

          getLocaleExtraDayPeriodRules: (locale: string) => (Time | [Time, Time])[];
          • Retrieves locale-specific rules used to determine which day period to use when more than one period is defined for a locale.

            There is a rule for each defined day period. The first rule is applied to the first day period and so on. Fall back to AM/PM when no rules are available.

            A rule can specify a period as time range, or as a single time value.

            This functionality is only available when you have loaded the full locale data. See the ["I18n guide"](guide/i18n#i18n-pipes).

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            The rules for the locale, a single time value or array of *from-time, to-time*, or null if no periods are available.

            See Also

            • getLocaleExtraDayPeriods()

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleExtraDayPeriods

          getLocaleExtraDayPeriods: (
          locale: string,
          formStyle: FormStyle,
          width: TranslationWidth
          ) => string[];
          • Retrieves locale-specific day periods, which indicate roughly how a day is broken up in different languages. For example, for en-US, periods are morning, noon, afternoon, evening, and midnight.

            This functionality is only available when you have loaded the full locale data. See the ["I18n guide"](guide/i18n#i18n-pipes).

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter formStyle

            The required grammatical form.

            Parameter width

            The required character width.

            Returns

            The translated day-period strings.

            See Also

            • getLocaleExtraDayPeriodRules()

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleFirstDayOfWeek

          getLocaleFirstDayOfWeek: (locale: string) => WeekDay;
          • Retrieves the first day of the week for the given locale.

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            A day index number, using the 0-based week-day index for en-US (Sunday = 0, Monday = 1, ...). For example, for fr-FR, returns 1 to indicate that the first day is Monday.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleId

          getLocaleId: (locale: string) => string;
          • Retrieves the locale ID from the currently loaded locale. The loaded locale could be, for example, a global one rather than a regional one.

            Parameter locale

            A locale code, such as fr-FR.

            Returns

            The locale code. For example, fr.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleMonthNames

          getLocaleMonthNames: (
          locale: string,
          formStyle: FormStyle,
          width: TranslationWidth
          ) => ReadonlyArray<string>;
          • Retrieves months of the year for the given locale, using the Gregorian calendar.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter formStyle

            The required grammatical form.

            Parameter width

            The required character width.

            Returns

            An array of localized name strings. For example, [January, February, ...] for en-US.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleNumberFormat

          getLocaleNumberFormat: (locale: string, type: NumberFormatStyle) => string;
          • Retrieves a number format for a given locale.

            Numbers are formatted using patterns, like #,###.00. For example, the pattern #,###.00 when used to format the number 12345.678 could result in "12'345,678". That would happen if the grouping separator for your language is an apostrophe, and the decimal separator is a comma.

            Important: The characters . , 0 # (and others below) are special placeholders that stand for the decimal separator, and so on, and are NOT real characters. You must NOT "translate" the placeholders. For example, don't change . to , even though in your language the decimal point is written with a comma. The symbols should be replaced by the local equivalents, using the appropriate NumberSymbol for your language.

            Here are the special characters used in number patterns:

            | Symbol | Meaning | |--------|---------| | . | Replaced automatically by the character used for the decimal point. | | , | Replaced by the "grouping" (thousands) separator. | | 0 | Replaced by a digit (or zero if there aren't enough digits). | | # | Replaced by a digit (or nothing if there aren't enough). | | ¤ | Replaced by a currency symbol, such as $ or USD. | | % | Marks a percent format. The % symbol may change position, but must be retained. | | E | Marks a scientific format. The E symbol may change position, but must be retained. | | ' | Special characters used as literal characters are quoted with ASCII single quotes. |

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter type

            The type of numeric value to be formatted (such as Decimal or Currency.)

            Returns

            The localized format string.

            See Also

            • NumberFormatStyle

            • [CLDR website](http://cldr.unicode.org/translation/number-patterns)

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleNumberSymbol

          getLocaleNumberSymbol: (locale: string, symbol: NumberSymbol) => string;
          • Retrieves a localized number symbol that can be used to replace placeholders in number formats.

            Parameter locale

            The locale code.

            Parameter symbol

            The symbol to localize.

            Returns

            The character for the localized symbol.

            See Also

            • NumberSymbol

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocalePluralCase

          getLocalePluralCase: (locale: string) => (value: number) => Plural;
          • core/ɵgetLocalePluralCase

          function getLocaleTimeFormat

          getLocaleTimeFormat: (locale: string, width: FormatWidth) => string;
          • Retrieves a localized time-value formatting string.

            Parameter locale

            A locale code for the locale format rules to use.

            Parameter width

            The format type.

            Returns

            The localized formatting string.

            See Also

            • FormatWidth

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getLocaleWeekEndRange

          getLocaleWeekEndRange: (locale: string) => [WeekDay, WeekDay];
          • Range of week days that are considered the week-end for the given locale.

            Parameter locale

            A locale code for the locale format rules to use.

            Returns

            The range of day values, [startDay, endDay].

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function getNumberOfCurrencyDigits

          getNumberOfCurrencyDigits: (code: string) => number;
          • Reports the number of decimal digits for a given currency. The value depends upon the presence of cents in that particular currency.

            Parameter code

            The currency code.

            Returns

            The number of decimal digits, typically 0 or 2.

            See Also

            • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

          function isPlatformBrowser

          isPlatformBrowser: (platformId: Object) => boolean;
          • Returns whether a platform id represents a browser platform.

          function isPlatformServer

          isPlatformServer: (platformId: Object) => boolean;
          • Returns whether a platform id represents a server platform.

          function isPlatformWorkerApp

          isPlatformWorkerApp: (platformId: Object) => boolean;
          • Returns whether a platform id represents a web worker app platform.

          function isPlatformWorkerUi

          isPlatformWorkerUi: (platformId: Object) => boolean;
          • Returns whether a platform id represents a web worker UI platform.

          function ɵangular_packages_common_common_a

          ɵangular_packages_common_common_a: () => ɵBrowserPlatformLocation;

            function ɵangular_packages_common_common_b

            ɵangular_packages_common_common_b: () => ɵBrowserPlatformLocation;

              function ɵangular_packages_common_common_c

              ɵangular_packages_common_common_c: () => Location;

                function ɵangular_packages_common_common_d

                ɵangular_packages_common_common_d: (
                platformLocation: PlatformLocation
                ) => PathLocationStrategy;

                  function ɵgetDOM

                  ɵgetDOM: () => ɵDomAdapter;

                    function ɵparseCookieValue

                    ɵparseCookieValue: (cookieStr: string, name: string) => string | null;

                      function ɵsetRootDomAdapter

                      ɵsetRootDomAdapter: (adapter: ɵDomAdapter) => void;

                        function registerLocaleData

                        registerLocaleData: (
                        data: any,
                        localeId?: string | any,
                        extraData?: any
                        ) => void;
                        • Register global data to be used internally by Angular. See the ["I18n guide"](guide/i18n#i18n-pipes) to know how to import additional locale data.

                          The signature registerLocaleData(data: any, extraData?: any) is deprecated since v5.1

                        Classes

                        class AsyncPipe

                        class AsyncPipe implements OnDestroy, PipeTransform {}
                        • CommonModule

                          Unwraps a value from an asynchronous primitive.

                          The async pipe subscribes to an Observable or Promise and returns the latest value it has emitted. When a new value is emitted, the async pipe marks the component to be checked for changes. When the component gets destroyed, the async pipe unsubscribes automatically to avoid potential memory leaks.

                          ### Examples

                          This example binds a Promise to the view. Clicking the Resolve button resolves the promise.

                          It's also possible to use async with Observables. The example below binds the time Observable to the view. The Observable continuously updates the view with the current time.

                        constructor

                        constructor(_ref: any);

                          method ngOnDestroy

                          ngOnDestroy: () => void;

                            method transform

                            transform: {
                            <T>(obj: Observable<T> | Subscribable<T> | Promise<T>): T | null;
                            <T>(obj: null): null;
                            <T>(obj: any): T;
                            };

                              class CommonModule

                              class CommonModule {}
                              • Exports all the basic Angular directives and pipes, such as NgIf, NgForOf, DecimalPipe, and so on. Re-exported by BrowserModule, which is included automatically in the root AppModule when you create a new app with the CLI new command.

                                * The providers options configure the NgModule's injector to provide localization dependencies to members. * The exports options make the declared directives and pipes available for import by other NgModules.

                              class CurrencyPipe

                              class CurrencyPipe implements PipeTransform {}
                              • CommonModule

                                Transforms a number to a currency string, formatted according to locale rules that determine group sizing and separator, decimal-point character, and other locale-specific configurations.

                                **Deprecation notice:**

                                The default currency code is currently always USD but this is deprecated from v9.

                                **In v11 the default currency code will be taken from the current locale identified by the LOCALE_ID token. See the [i18n guide](guide/i18n#setting-up-the-locale-of-your-app) for more information.**

                                If you need the previous behavior then set it by creating a DEFAULT_CURRENCY_CODE provider in your application NgModule:

                                {provide: DEFAULT_CURRENCY_CODE, useValue: 'USD'}

                                See Also

                                • getCurrencySymbol()

                                • formatCurrency()

                                  The following code shows how the pipe transforms numbers into text strings, according to various format specifications, where the caller's default locale is en-US.

                              constructor

                              constructor(_locale: string, _defaultCurrencyCode?: string);

                                method transform

                                transform: {
                                (
                                value: number | string,
                                currencyCode?: string,
                                display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean,
                                digitsInfo?: string,
                                locale?: string
                                ): string | null;
                                (
                                value: null,
                                currencyCode?: string,
                                display?: string | boolean,
                                digitsInfo?: string,
                                locale?: string
                                ): null;
                                (
                                value: string | number,
                                currencyCode?: string,
                                display?: string | boolean,
                                digitsInfo?: string,
                                locale?: string
                                ): string;
                                };
                                • Parameter value

                                  The number to be formatted as currency.

                                  Parameter currencyCode

                                  The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) currency code, such as USD for the US dollar and EUR for the euro. The default currency code can be configured using the DEFAULT_CURRENCY_CODE injection token.

                                  Parameter display

                                  The format for the currency indicator. One of the following: - code: Show the code (such as USD). - symbol(default): Show the symbol (such as $). - symbol-narrow: Use the narrow symbol for locales that have two symbols for their currency. For example, the Canadian dollar CAD has the symbol CA$ and the symbol-narrow $. If the locale has no narrow symbol, uses the standard symbol for the locale. - String: Use the given string value instead of a code or a symbol. For example, an empty string will suppress the currency & symbol. - Boolean (marked deprecated in v5): true for symbol and false for code.

                                  Parameter digitsInfo

                                  Decimal representation options, specified by a string in the following format: {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. - minIntegerDigits: The minimum number of integer digits before the decimal point. Default is 1. - minFractionDigits: The minimum number of digits after the decimal point. Default is 2. - maxFractionDigits: The maximum number of digits after the decimal point. Default is 2. If not provided, the number will be formatted with the proper amount of digits, depending on what the [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) specifies. For example, the Canadian dollar has 2 digits, whereas the Chilean peso has none.

                                  Parameter locale

                                  A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default. See [Setting your app locale](guide/i18n#setting-up-the-locale-of-your-app).

                                class DatePipe

                                class DatePipe implements PipeTransform {}
                                • CommonModule

                                  Formats a date value according to locale rules.

                                  DatePipe is executed only when it detects a pure change to the input value. A pure change is either a change to a primitive input value (such as String, Number, Boolean, or Symbol), or a changed object reference (such as Date, Array, Function, or Object).

                                  Note that mutating a Date object does not cause the pipe to be rendered again. To ensure that the pipe is executed, you must create a new Date object.

                                  Only the en-US locale data comes with Angular. To localize dates in another language, you must import the corresponding locale data. See the [I18n guide](guide/i18n#i18n-pipes) for more information.

                                  See Also

                                  • formatDate()

                                    The result of this pipe is not reevaluated when the input is mutated. To avoid the need to reformat the date on every change-detection cycle, treat the date as an immutable object and change the reference when the pipe needs to run again.

                                    ### Pre-defined format options

                                    | Option | Equivalent to | Examples (given in en-US locale) | |---------------|-------------------------------------|-------------------------------------------------| | 'short' | 'M/d/yy, h:mm a' | 6/15/15, 9:03 AM | | 'medium' | 'MMM d, y, h:mm:ss a' | Jun 15, 2015, 9:03:01 AM | | 'long' | 'MMMM d, y, h:mm:ss a z' | June 15, 2015 at 9:03:01 AM GMT+1 | | 'full' | 'EEEE, MMMM d, y, h:mm:ss a zzzz' | Monday, June 15, 2015 at 9:03:01 AM GMT+01:00 | | 'shortDate' | 'M/d/yy' | 6/15/15 | | 'mediumDate'| 'MMM d, y' | Jun 15, 2015 | | 'longDate' | 'MMMM d, y' | June 15, 2015 | | 'fullDate' | 'EEEE, MMMM d, y' | Monday, June 15, 2015 | | 'shortTime' | 'h:mm a' | 9:03 AM | | 'mediumTime'| 'h:mm:ss a' | 9:03:01 AM | | 'longTime' | 'h:mm:ss a z' | 9:03:01 AM GMT+1 | | 'fullTime' | 'h:mm:ss a zzzz' | 9:03:01 AM GMT+01:00 |

                                    ### Custom format options

                                    You can construct a format string using symbols to specify the components of a date-time value, as described in the following table. Format details depend on the locale. Fields marked with (*) are only available in the extra data set for the given locale.

                                    | Field type | Format | Description | Example Value | |-------------------- |-------------|---------------------------------------------------------------|------------------------------------------------------------| | Era | G, GG & GGG | Abbreviated | AD | | | GGGG | Wide | Anno Domini | | | GGGGG | Narrow | A | | Year | y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 | | | yy | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 | | | yyy | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 | | | yyyy | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 | | Week-numbering year | Y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 | | | YY | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 | | | YYY | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 | | | YYYY | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 | | Month | M | Numeric: 1 digit | 9, 12 | | | MM | Numeric: 2 digits + zero padded | 09, 12 | | | MMM | Abbreviated | Sep | | | MMMM | Wide | September | | | MMMMM | Narrow | S | | Month standalone | L | Numeric: 1 digit | 9, 12 | | | LL | Numeric: 2 digits + zero padded | 09, 12 | | | LLL | Abbreviated | Sep | | | LLLL | Wide | September | | | LLLLL | Narrow | S | | Week of year | w | Numeric: minimum digits | 1... 53 | | | ww | Numeric: 2 digits + zero padded | 01... 53 | | Week of month | W | Numeric: 1 digit | 1... 5 | | Day of month | d | Numeric: minimum digits | 1 | | | dd | Numeric: 2 digits + zero padded | 01 | | Week day | E, EE & EEE | Abbreviated | Tue | | | EEEE | Wide | Tuesday | | | EEEEE | Narrow | T | | | EEEEEE | Short | Tu | | Week day standalone | c, cc | Numeric: 1 digit | 2 | | | ccc | Abbreviated | Tue | | | cccc | Wide | Tuesday | | | ccccc | Narrow | T | | | cccccc | Short | Tu | | Period | a, aa & aaa | Abbreviated | am/pm or AM/PM | | | aaaa | Wide (fallback to a when missing) | ante meridiem/post meridiem | | | aaaaa | Narrow | a/p | | Period* | B, BB & BBB | Abbreviated | mid. | | | BBBB | Wide | am, pm, midnight, noon, morning, afternoon, evening, night | | | BBBBB | Narrow | md | | Period standalone* | b, bb & bbb | Abbreviated | mid. | | | bbbb | Wide | am, pm, midnight, noon, morning, afternoon, evening, night | | | bbbbb | Narrow | md | | Hour 1-12 | h | Numeric: minimum digits | 1, 12 | | | hh | Numeric: 2 digits + zero padded | 01, 12 | | Hour 0-23 | H | Numeric: minimum digits | 0, 23 | | | HH | Numeric: 2 digits + zero padded | 00, 23 | | Minute | m | Numeric: minimum digits | 8, 59 | | | mm | Numeric: 2 digits + zero padded | 08, 59 | | Second | s | Numeric: minimum digits | 0... 59 | | | ss | Numeric: 2 digits + zero padded | 00... 59 | | Fractional seconds | S | Numeric: 1 digit | 0... 9 | | | SS | Numeric: 2 digits + zero padded | 00... 99 | | | SSS | Numeric: 3 digits + zero padded (= milliseconds) | 000... 999 | | Zone | z, zz & zzz | Short specific non location format (fallback to O) | GMT-8 | | | zzzz | Long specific non location format (fallback to OOOO) | GMT-08:00 | | | Z, ZZ & ZZZ | ISO8601 basic format | -0800 | | | ZZZZ | Long localized GMT format | GMT-8:00 | | | ZZZZZ | ISO8601 extended format + Z indicator for offset 0 (= XXXXX) | -08:00 | | | O, OO & OOO | Short localized GMT format | GMT-8 | | | OOOO | Long localized GMT format | GMT-08:00 |

                                    ### Format examples

                                    These examples transform a date into various formats, assuming that dateObj is a JavaScript Date object for year: 2015, month: 6, day: 15, hour: 21, minute: 43, second: 11, given in the local time for the en-US locale.

                                    {{ dateObj | date }} // output is 'Jun 15, 2015'
                                    {{ dateObj | date:'medium' }} // output is 'Jun 15, 2015, 9:43:11 PM'
                                    {{ dateObj | date:'shortTime' }} // output is '9:43 PM'
                                    {{ dateObj | date:'mm:ss' }} // output is '43:11'

                                    ### Usage example

                                    The following component uses a date pipe to display the current date in different formats.

                                    @Component({
                                    selector: 'date-pipe',
                                    template: `<div>
                                    <p>Today is {{today | date}}</p>
                                    <p>Or if you prefer, {{today | date:'fullDate'}}</p>
                                    <p>The time is {{today | date:'h:mm a z'}}</p>
                                    </div>`
                                    })
                                    // Get the current date and time as a date-time value.
                                    export class DatePipeComponent {
                                    today: number = Date.now();
                                    }

                                constructor

                                constructor(locale: string);

                                  method transform

                                  transform: {
                                  (
                                  value: Date | string | number,
                                  format?: string,
                                  timezone?: string,
                                  locale?: string
                                  ): string | null;
                                  (value: null, format?: string, timezone?: string, locale?: string): null;
                                  (
                                  value: string | number | Date,
                                  format?: string,
                                  timezone?: string,
                                  locale?: string
                                  ): string;
                                  };
                                  • Parameter value

                                    The date expression: a Date object, a number (milliseconds since UTC epoch), or an ISO string (https://www.w3.org/TR/NOTE-datetime).

                                    Parameter format

                                    The date/time components to include, using predefined options or a custom format string.

                                    Parameter timezone

                                    A timezone offset (such as '+0430'), or a standard UTC/GMT or continental US timezone abbreviation. When not supplied, uses the end-user's local system timezone.

                                    Parameter locale

                                    A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default. See [Setting your app locale](guide/i18n#setting-up-the-locale-of-your-app).

                                    Returns

                                    A date string in the desired format.

                                  class DecimalPipe

                                  class DecimalPipe implements PipeTransform {}
                                  • CommonModule

                                    Formats a value according to digit options and locale rules. Locale determines group sizing and separator, decimal point character, and other locale-specific configurations.

                                    See Also

                                    • formatNumber()

                                      ### digitsInfo

                                      The value's decimal representation is specified by the digitsInfo parameter, written in the following format:

                                      {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}

                                      - minIntegerDigits: The minimum number of integer digits before the decimal point. Default is 1.

                                      - minFractionDigits: The minimum number of digits after the decimal point. Default is 0.

                                      - maxFractionDigits: The maximum number of digits after the decimal point. Default is 3.

                                      If the formatted value is truncated it will be rounded using the "to-nearest" method:

                                      {{3.6 | number: '1.0-0'}}
                                      <!--will output '4'-->
                                      {{-3.6 | number:'1.0-0'}}
                                      <!--will output '-4'-->

                                      ### locale

                                      locale will format a value according to locale rules. Locale determines group sizing and separator, decimal point character, and other locale-specific configurations.

                                      When not supplied, uses the value of LOCALE_ID, which is en-US by default.

                                      See [Setting your app locale](guide/i18n#setting-up-the-locale-of-your-app).

                                      ### Example

                                      The following code shows how the pipe transforms values according to various format specifications, where the caller's default locale is en-US.

                                  constructor

                                  constructor(_locale: string);

                                    method transform

                                    transform: {
                                    (value: number | string, digitsInfo?: string, locale?: string):
                                    | string
                                    | null;
                                    (value: null, digitsInfo?: string, locale?: string): null;
                                    (value: string | number, digitsInfo?: string, locale?: string): string;
                                    };

                                      class HashLocationStrategy

                                      class HashLocationStrategy extends LocationStrategy implements OnDestroy {}
                                      • A LocationStrategy used to configure the Location service to represent its state in the [hash fragment](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax) of the browser's URL.

                                        For instance, if you call location.go('/foo'), the browser's URL will become example.com#/foo.

                                        ### Example

                                      constructor

                                      constructor(_platformLocation: PlatformLocation, _baseHref?: string);

                                        method back

                                        back: () => void;

                                          method forward

                                          forward: () => void;

                                            method getBaseHref

                                            getBaseHref: () => string;

                                              method historyGo

                                              historyGo: (relativePosition?: number) => void;

                                                method ngOnDestroy

                                                ngOnDestroy: () => void;

                                                  method onPopState

                                                  onPopState: (fn: LocationChangeListener) => void;

                                                    method path

                                                    path: (includeHash?: boolean) => string;

                                                      method prepareExternalUrl

                                                      prepareExternalUrl: (internal: string) => string;

                                                        method pushState

                                                        pushState: (
                                                        state: any,
                                                        title: string,
                                                        path: string,
                                                        queryParams: string
                                                        ) => void;

                                                          method replaceState

                                                          replaceState: (
                                                          state: any,
                                                          title: string,
                                                          path: string,
                                                          queryParams: string
                                                          ) => void;

                                                            class I18nPluralPipe

                                                            class I18nPluralPipe implements PipeTransform {}
                                                            • CommonModule

                                                              Maps a value to a string that pluralizes the value according to locale rules.

                                                              ### Example

                                                            constructor

                                                            constructor(_localization: NgLocalization);

                                                              method transform

                                                              transform: (
                                                              value: number | null | undefined,
                                                              pluralMap: { [count: string]: string },
                                                              locale?: string
                                                              ) => string;
                                                              • Parameter value

                                                                the number to be formatted

                                                                Parameter pluralMap

                                                                an object that mimics the ICU format, see http://userguide.icu-project.org/formatparse/messages.

                                                                Parameter locale

                                                                a string defining the locale to use (uses the current LOCALE_ID by default).

                                                              class I18nSelectPipe

                                                              class I18nSelectPipe implements PipeTransform {}
                                                              • CommonModule

                                                                Generic selector that displays the string that matches the current value.

                                                                If none of the keys of the mapping match the value, then the content of the other key is returned when present, otherwise an empty string is returned.

                                                                ### Example

                                                              method transform

                                                              transform: (
                                                              value: string | null | undefined,
                                                              mapping: { [key: string]: string }
                                                              ) => string;
                                                              • Parameter value

                                                                a string to be internationalized.

                                                                Parameter mapping

                                                                an object that indicates the text that should be displayed for different values of the provided value.

                                                              class JsonPipe

                                                              class JsonPipe implements PipeTransform {}
                                                              • CommonModule

                                                                Converts a value into its JSON-format representation. Useful for debugging.

                                                                The following component uses a JSON pipe to convert an object to JSON format, and displays the string in both formats for comparison.

                                                              method transform

                                                              transform: (value: any) => string;
                                                              • Parameter value

                                                                A value of any type to convert into a JSON-format string.

                                                              class KeyValuePipe

                                                              class KeyValuePipe implements PipeTransform {}
                                                              • CommonModule

                                                                Transforms Object or Map into an array of key value pairs.

                                                                The output array will be ordered by keys. By default the comparator will be by Unicode point value. You can optionally pass a compareFn if your keys are complex types.

                                                                ### Examples

                                                                This examples show how an Object or a Map can be iterated by ngFor with the use of this keyvalue pipe.

                                                              constructor

                                                              constructor(differs: any);

                                                                method transform

                                                                transform: {
                                                                <K, V>(
                                                                input: ReadonlyMap<K, V>,
                                                                compareFn?: (a: KeyValue<K, V>, b: KeyValue<K, V>) => number
                                                                ): Array<KeyValue<K, V>>;
                                                                <K extends number, V>(
                                                                input: Record<K, V>,
                                                                compareFn?: (a: KeyValue<string, V>, b: KeyValue<string, V>) => number
                                                                ): KeyValue<string, V>[];
                                                                <K extends string, V>(
                                                                input: Record<K, V> | ReadonlyMap<K, V>,
                                                                compareFn?: (a: KeyValue<K, V>, b: KeyValue<K, V>) => number
                                                                ): KeyValue<K, V>[];
                                                                (
                                                                input: null,
                                                                compareFn?: (
                                                                a: KeyValue<unknown, unknown>,
                                                                b: KeyValue<unknown, unknown>
                                                                ) => number
                                                                ): null;
                                                                <K, V>(
                                                                input: ReadonlyMap<K, V>,
                                                                compareFn?: (a: KeyValue<K, V>, b: KeyValue<K, V>) => number
                                                                ): KeyValue<K, V>[];
                                                                <K extends number, V>(
                                                                input: Record<K, V>,
                                                                compareFn?: (a: KeyValue<string, V>, b: KeyValue<string, V>) => number
                                                                ): KeyValue<string, V>[];
                                                                <K extends string, V>(
                                                                input: Record<K, V> | ReadonlyMap<K, V>,
                                                                compareFn?: (a: KeyValue<K, V>, b: KeyValue<K, V>) => number
                                                                ): KeyValue<K, V>[];
                                                                };

                                                                  class Location

                                                                  class Location {}
                                                                  • A service that applications can use to interact with a browser's URL.

                                                                    Depending on the LocationStrategy used, Location persists to the URL's path or the URL's hash segment.

                                                                    It's better to use the Router.navigate() service to trigger route changes. Use Location only if you need to interact with or create normalized URLs outside of routing.

                                                                    Location is responsible for normalizing the URL against the application's base href. A normalized URL is absolute from the URL host, includes the application's base href, and has no trailing slash: - /my/app/user/123 is normalized - my/app/user/123 **is not** normalized - /my/app/user/123/ **is not** normalized

                                                                    ### Example

                                                                  constructor

                                                                  constructor(
                                                                  platformStrategy: LocationStrategy,
                                                                  platformLocation: PlatformLocation
                                                                  );

                                                                    property joinWithSlash

                                                                    static joinWithSlash: (start: string, end: string) => string;
                                                                    • Joins two parts of a URL with a slash if needed.

                                                                      Parameter start

                                                                      URL string

                                                                      Parameter end

                                                                      URL string

                                                                      Returns

                                                                      The joined URL string.

                                                                    property normalizeQueryParams

                                                                    static normalizeQueryParams: (params: string) => string;
                                                                    • Normalizes URL parameters by prepending with ? if needed.

                                                                      Parameter params

                                                                      String of URL parameters.

                                                                      Returns

                                                                      The normalized URL parameters string.

                                                                    property stripTrailingSlash

                                                                    static stripTrailingSlash: (url: string) => string;
                                                                    • Removes a trailing slash from a URL string if needed. Looks for the first occurrence of either #, ?, or the end of the line as / characters and removes the trailing slash if one exists.

                                                                      Parameter url

                                                                      URL string.

                                                                      Returns

                                                                      The URL string, modified if needed.

                                                                    method back

                                                                    back: () => void;
                                                                    • Navigates back in the platform's history.

                                                                    method forward

                                                                    forward: () => void;
                                                                    • Navigates forward in the platform's history.

                                                                    method getState

                                                                    getState: () => unknown;
                                                                    • Reports the current state of the location history.

                                                                      Returns

                                                                      The current value of the history.state object.

                                                                    method go

                                                                    go: (path: string, query?: string, state?: any) => void;
                                                                    • Changes the browser's URL to a normalized version of a given URL, and pushes a new item onto the platform's history.

                                                                      Parameter path

                                                                      URL path to normalize.

                                                                      Parameter query

                                                                      Query parameters.

                                                                      Parameter state

                                                                      Location history state.

                                                                    method historyGo

                                                                    historyGo: (relativePosition?: number) => void;
                                                                    • Navigate to a specific page from session history, identified by its relative position to the current page.

                                                                      Parameter relativePosition

                                                                      Position of the target page in the history relative to the current page. A negative value moves backwards, a positive value moves forwards, e.g. location.historyGo(2) moves forward two pages and location.historyGo(-2) moves back two pages. When we try to go beyond what's stored in the history session, we stay in the current page. Same behaviour occurs when relativePosition equals 0.

                                                                      See Also

                                                                      • https://developer.mozilla.org/en-US/docs/Web/API/History_API#Moving_to_a_specific_point_in_history

                                                                    method isCurrentPathEqualTo

                                                                    isCurrentPathEqualTo: (path: string, query?: string) => boolean;
                                                                    • Normalizes the given path and compares to the current normalized path.

                                                                      Parameter path

                                                                      The given URL path.

                                                                      Parameter query

                                                                      Query parameters.

                                                                      Returns

                                                                      True if the given URL path is equal to the current normalized path, false otherwise.

                                                                    method normalize

                                                                    normalize: (url: string) => string;
                                                                    • Normalizes a URL path by stripping any trailing slashes.

                                                                      Parameter url

                                                                      String representing a URL.

                                                                      Returns

                                                                      The normalized URL string.

                                                                    method onUrlChange

                                                                    onUrlChange: (fn: (url: string, state: unknown) => void) => void;
                                                                    • Registers a URL change listener. Use to catch updates performed by the Angular framework that are not detectible through "popstate" or "hashchange" events.

                                                                      Parameter fn

                                                                      The change handler function, which take a URL and a location history state.

                                                                    method path

                                                                    path: (includeHash?: boolean) => string;
                                                                    • Normalizes the URL path for this location.

                                                                      Parameter includeHash

                                                                      True to include an anchor fragment in the path.

                                                                      Returns

                                                                      The normalized URL path.

                                                                    method prepareExternalUrl

                                                                    prepareExternalUrl: (url: string) => string;
                                                                    • Normalizes an external URL path. If the given URL doesn't begin with a leading slash ('/'), adds one before normalizing. Adds a hash if HashLocationStrategy is in use, or the APP_BASE_HREF if the PathLocationStrategy is in use.

                                                                      Parameter url

                                                                      String representing a URL.

                                                                      Returns

                                                                      A normalized platform-specific URL.

                                                                    method replaceState

                                                                    replaceState: (path: string, query?: string, state?: any) => void;
                                                                    • Changes the browser's URL to a normalized version of the given URL, and replaces the top item on the platform's history stack.

                                                                      Parameter path

                                                                      URL path to normalize.

                                                                      Parameter query

                                                                      Query parameters.

                                                                      Parameter state

                                                                      Location history state.

                                                                    method subscribe

                                                                    subscribe: (
                                                                    onNext: (value: PopStateEvent) => void,
                                                                    onThrow?: (exception: any) => void,
                                                                    onReturn?: (() => void) | null
                                                                    ) => any;
                                                                    • Subscribes to the platform's popState events.

                                                                      Note: Location.go() does not trigger the popState event in the browser. Use Location.onUrlChange() to subscribe to URL changes instead.

                                                                      Parameter value

                                                                      Event that is triggered when the state history changes.

                                                                      Parameter exception

                                                                      The exception to throw.

                                                                      Returns

                                                                      Subscribed events.

                                                                      See Also

                                                                      • [onpopstate](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate)

                                                                    class LocationStrategy

                                                                    abstract class LocationStrategy {}
                                                                    • Enables the Location service to read route state from the browser's URL. Angular provides two strategies: HashLocationStrategy and PathLocationStrategy.

                                                                      Applications should use the Router or Location services to interact with application route state.

                                                                      For instance, HashLocationStrategy produces URLs like http://example.com#/foo, and PathLocationStrategy produces http://example.com/foo as an equivalent URL.

                                                                      See these two classes for more.

                                                                    method back

                                                                    abstract back: () => void;

                                                                      method forward

                                                                      abstract forward: () => void;

                                                                        method getBaseHref

                                                                        abstract getBaseHref: () => string;

                                                                          method historyGo

                                                                          historyGo: (relativePosition: number) => void;

                                                                            method onPopState

                                                                            abstract onPopState: (fn: LocationChangeListener) => void;

                                                                              method path

                                                                              abstract path: (includeHash?: boolean) => string;

                                                                                method prepareExternalUrl

                                                                                abstract prepareExternalUrl: (internal: string) => string;

                                                                                  method pushState

                                                                                  abstract pushState: (
                                                                                  state: any,
                                                                                  title: string,
                                                                                  url: string,
                                                                                  queryParams: string
                                                                                  ) => void;

                                                                                    method replaceState

                                                                                    abstract replaceState: (
                                                                                    state: any,
                                                                                    title: string,
                                                                                    url: string,
                                                                                    queryParams: string
                                                                                    ) => void;

                                                                                      class LowerCasePipe

                                                                                      class LowerCasePipe implements PipeTransform {}
                                                                                      • Transforms text to all lower case.

                                                                                        See Also

                                                                                        • UpperCasePipe

                                                                                        • TitleCasePipe

                                                                                          The following example defines a view that allows the user to enter text, and then uses the pipe to convert the input text to all lower case.

                                                                                          CommonModule

                                                                                      method transform

                                                                                      transform: {
                                                                                      (value: string): string;
                                                                                      (value: null): null;
                                                                                      (value: string): string;
                                                                                      };
                                                                                      • Parameter value

                                                                                        The string to transform to lower case.

                                                                                      class NgClass

                                                                                      class NgClass implements DoCheck {}
                                                                                      • CommonModule

                                                                                        <some-element [ngClass]="'first second'">...</some-element>
                                                                                        <some-element [ngClass]="['first', 'second']">...</some-element>
                                                                                        <some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element>
                                                                                        <some-element [ngClass]="stringExp|arrayExp|objExp">...</some-element>
                                                                                        <some-element [ngClass]="{'class1 class2 class3' : true}">...</some-element>

                                                                                        Adds and removes CSS classes on an HTML element.

                                                                                        The CSS classes are updated as follows, depending on the type of the expression evaluation: - string - the CSS classes listed in the string (space delimited) are added, - Array - the CSS classes declared as Array elements are added, - Object - keys are CSS classes that get added when the expression given in the value evaluates to a truthy value, otherwise they are removed.

                                                                                      constructor

                                                                                      constructor(
                                                                                      _iterableDiffers: any,
                                                                                      _keyValueDiffers: any,
                                                                                      _ngEl: any,
                                                                                      _renderer: any
                                                                                      );

                                                                                        method ngDoCheck

                                                                                        ngDoCheck: () => void;

                                                                                          class NgComponentOutlet

                                                                                          class NgComponentOutlet implements OnChanges, OnDestroy {}
                                                                                          • Instantiates a single Component type and inserts its Host View into current View. NgComponentOutlet provides a declarative approach for dynamic component creation.

                                                                                            NgComponentOutlet requires a component type, if a falsy value is set the view will clear and any existing component will get destroyed.

                                                                                            ### Fine tune control

                                                                                            You can control the component creation process by using the following optional attributes:

                                                                                            * ngComponentOutletInjector: Optional custom Injector that will be used as parent for the Component. Defaults to the injector of the current view container.

                                                                                            * ngComponentOutletContent: Optional list of projectable nodes to insert into the content section of the component, if exists.

                                                                                            * ngComponentOutletNgModuleFactory: Optional module factory to allow dynamically loading other module, then load a component from that module.

                                                                                            ### Syntax

                                                                                            Simple

                                                                                            <ng-container *ngComponentOutlet="componentTypeExpression"></ng-container>

                                                                                            Customized injector/content

                                                                                            <ng-container *ngComponentOutlet="componentTypeExpression;
                                                                                            injector: injectorExpression;
                                                                                            content: contentNodesExpression;">
                                                                                            </ng-container>

                                                                                            Customized ngModuleFactory

                                                                                            <ng-container *ngComponentOutlet="componentTypeExpression;
                                                                                            ngModuleFactory: moduleFactory;">
                                                                                            </ng-container>

                                                                                            ### A simple example

                                                                                            A more complete example with additional options:

                                                                                            CommonModule

                                                                                          constructor

                                                                                          constructor(_viewContainerRef: any);

                                                                                            property ngComponentOutlet

                                                                                            ngComponentOutlet: any;

                                                                                              property ngComponentOutletContent

                                                                                              ngComponentOutletContent: any[][];

                                                                                                property ngComponentOutletInjector

                                                                                                ngComponentOutletInjector: any;

                                                                                                  property ngComponentOutletNgModuleFactory

                                                                                                  ngComponentOutletNgModuleFactory: any;

                                                                                                    method ngOnChanges

                                                                                                    ngOnChanges: (changes: any) => void;

                                                                                                      method ngOnDestroy

                                                                                                      ngOnDestroy: () => void;

                                                                                                        class NgForOf

                                                                                                        class NgForOf<T, U extends NgIterable<T> = NgIterable<T>> implements DoCheck {}
                                                                                                        • A [structural directive](guide/structural-directives) that renders a template for each item in a collection. The directive is placed on an element, which becomes the parent of the cloned templates.

                                                                                                          The ngForOf directive is generally used in the [shorthand form](guide/structural-directives#asterisk) *ngFor. In this form, the template to be rendered for each iteration is the content of an anchor element containing the directive.

                                                                                                          The following example shows the shorthand syntax with some options, contained in an <li> element.

                                                                                                          <li *ngFor="let item of items; index as i; trackBy: trackByFn">...</li>

                                                                                                          The shorthand form expands into a long form that uses the ngForOf selector on an <ng-template> element. The content of the <ng-template> element is the <li> element that held the short-form directive.

                                                                                                          Here is the expanded version of the short-form example.

                                                                                                          <ng-template ngFor let-item [ngForOf]="items" let-i="index" [ngForTrackBy]="trackByFn">
                                                                                                          <li>...</li>
                                                                                                          </ng-template>

                                                                                                          Angular automatically expands the shorthand syntax as it compiles the template. The context for each embedded view is logically merged to the current component context according to its lexical position.

                                                                                                          When using the shorthand syntax, Angular allows only [one structural directive on an element](guide/built-in-directives#one-per-element). If you want to iterate conditionally, for example, put the *ngIf on a container element that wraps the *ngFor element. For futher discussion, see [Structural Directives](guide/built-in-directives#one-per-element).

                                                                                                          ### Local variables

                                                                                                          NgForOf provides exported values that can be aliased to local variables. For example:

                                                                                                          ``` <li *ngFor="let user of users; index as i; first as isFirst"> {{i}}/{{users.length}}. {{user}} <span *ngIf="isFirst">default ```

                                                                                                          The following exported values can be aliased to local variables:

                                                                                                          - $implicit: T: The value of the individual items in the iterable (ngForOf). - ngForOf: NgIterable<T>: The value of the iterable expression. Useful when the expression is more complex then a property access, for example when using the async pipe (`userStreams | async`). - index: number: The index of the current item in the iterable. - count: number: The length of the iterable. - first: boolean: True when the item is the first item in the iterable. - last: boolean: True when the item is the last item in the iterable. - even: boolean: True when the item has an even index in the iterable. - odd: boolean: True when the item has an odd index in the iterable.

                                                                                                          ### Change propagation

                                                                                                          When the contents of the iterator changes, NgForOf makes the corresponding changes to the DOM:

                                                                                                          * When an item is added, a new instance of the template is added to the DOM. * When an item is removed, its template instance is removed from the DOM. * When items are reordered, their respective templates are reordered in the DOM.

                                                                                                          Angular uses object identity to track insertions and deletions within the iterator and reproduce those changes in the DOM. This has important implications for animations and any stateful controls that are present, such as <input> elements that accept user input. Inserted rows can be animated in, deleted rows can be animated out, and unchanged rows retain any unsaved state such as user input. For more on animations, see [Transitions and Triggers](guide/transition-and-triggers).

                                                                                                          The identities of elements in the iterator can change while the data does not. This can happen, for example, if the iterator is produced from an RPC to the server, and that RPC is re-run. Even if the data hasn't changed, the second response produces objects with different identities, and Angular must tear down the entire DOM and rebuild it (as if all old elements were deleted and all new elements inserted).

                                                                                                          To avoid this expensive operation, you can customize the default tracking algorithm. by supplying the trackBy option to NgForOf. trackBy takes a function that has two arguments: index and item. If trackBy is given, Angular tracks changes by the return value of the function.

                                                                                                          See Also

                                                                                                          • [Structural Directives](guide/structural-directives) CommonModule

                                                                                                        constructor

                                                                                                        constructor(_viewContainer: any, _template: any, _differs: any);

                                                                                                          property ngForTrackBy

                                                                                                          ngForTrackBy: any;

                                                                                                            method ngDoCheck

                                                                                                            ngDoCheck: () => void;
                                                                                                            • Applies the changes when needed.

                                                                                                            method ngTemplateContextGuard

                                                                                                            static ngTemplateContextGuard: <T, U extends any>(
                                                                                                            dir: NgForOf<T, U>,
                                                                                                            ctx: any
                                                                                                            ) => ctx is NgForOfContext<T, U>;
                                                                                                            • Asserts the correct type of the context for the template that NgForOf will render.

                                                                                                              The presence of this method is a signal to the Ivy template type-check compiler that the NgForOf structural directive renders its template with a specific context type.

                                                                                                            class NgForOfContext

                                                                                                            class NgForOfContext<T, U extends NgIterable<T> = NgIterable<T>> {}

                                                                                                            constructor

                                                                                                            constructor($implicit: {}, ngForOf: any, index: number, count: number);

                                                                                                              property $implicit

                                                                                                              $implicit: {};

                                                                                                                property count

                                                                                                                count: number;

                                                                                                                  property even

                                                                                                                  readonly even: boolean;

                                                                                                                    property first

                                                                                                                    readonly first: boolean;

                                                                                                                      property index

                                                                                                                      index: number;

                                                                                                                        property last

                                                                                                                        readonly last: boolean;

                                                                                                                          property ngForOf

                                                                                                                          ngForOf: any;

                                                                                                                            property odd

                                                                                                                            readonly odd: boolean;

                                                                                                                              class NgIf

                                                                                                                              class NgIf<T = unknown> {}
                                                                                                                              • A structural directive that conditionally includes a template based on the value of an expression coerced to Boolean. When the expression evaluates to true, Angular renders the template provided in a then clause, and when false or null, Angular renders the template provided in an optional else clause. The default template for the else clause is blank.

                                                                                                                                A [shorthand form](guide/structural-directives#asterisk) of the directive, *ngIf="condition", is generally used, provided as an attribute of the anchor element for the inserted template. Angular expands this into a more explicit version, in which the anchor element is contained in an <ng-template> element.

                                                                                                                                Simple form with shorthand syntax:

                                                                                                                                <div *ngIf="condition">Content to render when condition is true.</div>

                                                                                                                                Simple form with expanded syntax:

                                                                                                                                <ng-template [ngIf]="condition"><div>Content to render when condition is
                                                                                                                                true.</div></ng-template>

                                                                                                                                Form with an "else" block:

                                                                                                                                <div *ngIf="condition; else elseBlock">Content to render when condition is true.</div>
                                                                                                                                <ng-template #elseBlock>Content to render when condition is false.</ng-template>

                                                                                                                                Shorthand form with "then" and "else" blocks:

                                                                                                                                <div *ngIf="condition; then thenBlock else elseBlock"></div>
                                                                                                                                <ng-template #thenBlock>Content to render when condition is true.</ng-template>
                                                                                                                                <ng-template #elseBlock>Content to render when condition is false.</ng-template>

                                                                                                                                Form with storing the value locally:

                                                                                                                                <div *ngIf="condition as value; else elseBlock">{{value}}</div>
                                                                                                                                <ng-template #elseBlock>Content to render when value is null.</ng-template>

                                                                                                                                The *ngIf directive is most commonly used to conditionally show an inline template, as seen in the following example. The default else template is blank.

                                                                                                                                ### Showing an alternative template using else

                                                                                                                                To display a template when expression evaluates to false, use an else template binding as shown in the following example. The else binding points to an <ng-template> element labeled #elseBlock. The template can be defined anywhere in the component view, but is typically placed right after ngIf for readability.

                                                                                                                                ### Using an external then template

                                                                                                                                In the previous example, the then-clause template is specified inline, as the content of the tag that contains the ngIf directive. You can also specify a template that is defined externally, by referencing a labeled <ng-template> element. When you do this, you can change which template to use at runtime, as shown in the following example.

                                                                                                                                ### Storing a conditional result in a variable

                                                                                                                                You might want to show a set of properties from the same object. If you are waiting for asynchronous data, the object can be undefined. In this case, you can use ngIf and store the result of the condition in a local variable as shown in the following example.

                                                                                                                                This code uses only one AsyncPipe, so only one subscription is created. The conditional statement stores the result of userStream|async in the local variable user. You can then bind the local user repeatedly.

                                                                                                                                The conditional displays the data only if userStream returns a value, so you don't need to use the safe-navigation-operator (?.) to guard against null values when accessing properties. You can display an alternative template while waiting for the data.

                                                                                                                                ### Shorthand syntax

                                                                                                                                The shorthand syntax *ngIf expands into two separate template specifications for the "then" and "else" clauses. For example, consider the following shorthand statement, that is meant to show a loading page while waiting for data to be loaded.

                                                                                                                                <div class="hero-list" *ngIf="heroes else loading">
                                                                                                                                ...
                                                                                                                                </div>
                                                                                                                                <ng-template #loading>
                                                                                                                                <div>Loading...</div>
                                                                                                                                </ng-template>

                                                                                                                                You can see that the "else" clause references the <ng-template> with the #loading label, and the template for the "then" clause is provided as the content of the anchor element.

                                                                                                                                However, when Angular expands the shorthand syntax, it creates another <ng-template> tag, with ngIf and ngIfElse directives. The anchor element containing the template for the "then" clause becomes the content of this unlabeled <ng-template> tag.

                                                                                                                                <ng-template [ngIf]="heroes" [ngIfElse]="loading">
                                                                                                                                <div class="hero-list">
                                                                                                                                ...
                                                                                                                                </div>
                                                                                                                                </ng-template>
                                                                                                                                <ng-template #loading>
                                                                                                                                <div>Loading...</div>
                                                                                                                                </ng-template>

                                                                                                                                The presence of the implicit template object has implications for the nesting of structural directives. For more on this subject, see [Structural Directives](https://angular.io/guide/built-in-directives#one-per-element).

                                                                                                                                CommonModule

                                                                                                                              constructor

                                                                                                                              constructor(_viewContainer: any, templateRef: any);

                                                                                                                                property ngTemplateGuard_ngIf

                                                                                                                                static ngTemplateGuard_ngIf: string;
                                                                                                                                • Assert the correct type of the expression bound to the ngIf input within the template.

                                                                                                                                  The presence of this static field is a signal to the Ivy template type check compiler that when the NgIf structural directive renders its template, the type of the expression bound to ngIf should be narrowed in some way. For NgIf, the binding expression itself is used to narrow its type, which allows the strictNullChecks feature of TypeScript to work with NgIf.

                                                                                                                                method ngTemplateContextGuard

                                                                                                                                static ngTemplateContextGuard: <T>(
                                                                                                                                dir: NgIf<T>,
                                                                                                                                ctx: any
                                                                                                                                ) => ctx is NgIfContext<Exclude<T, false | '' | 0>>;
                                                                                                                                • Asserts the correct type of the context for the template that NgIf will render.

                                                                                                                                  The presence of this method is a signal to the Ivy template type-check compiler that the NgIf structural directive renders its template with a specific context type.

                                                                                                                                class NgIfContext

                                                                                                                                class NgIfContext<T = unknown> {}

                                                                                                                                property $implicit

                                                                                                                                $implicit: {};

                                                                                                                                  property ngIf

                                                                                                                                  ngIf: {};

                                                                                                                                    class NgLocaleLocalization

                                                                                                                                    class NgLocaleLocalization extends NgLocalization {}
                                                                                                                                    • Returns the plural case based on the locale

                                                                                                                                    constructor

                                                                                                                                    constructor(locale: string);

                                                                                                                                      property locale

                                                                                                                                      protected locale: string;

                                                                                                                                        method getPluralCategory

                                                                                                                                        getPluralCategory: (value: any, locale?: string) => string;

                                                                                                                                          class NgLocalization

                                                                                                                                          abstract class NgLocalization {}

                                                                                                                                          method getPluralCategory

                                                                                                                                          abstract getPluralCategory: (value: any, locale?: string) => string;

                                                                                                                                            class NgPlural

                                                                                                                                            class NgPlural {}
                                                                                                                                            • CommonModule

                                                                                                                                              <some-element [ngPlural]="value">
                                                                                                                                              <ng-template ngPluralCase="=0">there is nothing</ng-template>
                                                                                                                                              <ng-template ngPluralCase="=1">there is one</ng-template>
                                                                                                                                              <ng-template ngPluralCase="few">there are a few</ng-template>
                                                                                                                                              </some-element>

                                                                                                                                              Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization.

                                                                                                                                              Displays DOM sub-trees that match the switch expression value, or failing that, DOM sub-trees that match the switch expression's pluralization category.

                                                                                                                                              To use this directive you must provide a container element that sets the [ngPlural] attribute to a switch expression. Inner elements with a [ngPluralCase] will display based on their expression: - if [ngPluralCase] is set to a value starting with =, it will only display if the value matches the switch expression exactly, - otherwise, the view will be treated as a "category match", and will only display if exact value matches aren't found and the value maps to its category for the defined locale.

                                                                                                                                              See http://cldr.unicode.org/index/cldr-spec/plural-rules

                                                                                                                                            constructor

                                                                                                                                            constructor(_localization: NgLocalization);

                                                                                                                                              method addCase

                                                                                                                                              addCase: (value: string, switchView: SwitchView) => void;

                                                                                                                                                class NgPluralCase

                                                                                                                                                class NgPluralCase {}
                                                                                                                                                • CommonModule

                                                                                                                                                  Creates a view that will be added/removed from the parent NgPlural when the given expression matches the plural expression according to CLDR rules.

                                                                                                                                                  <some-element [ngPlural]="value">
                                                                                                                                                  <ng-template ngPluralCase="=0">...</ng-template>
                                                                                                                                                  <ng-template ngPluralCase="other">...</ng-template>
                                                                                                                                                  </some-element>

                                                                                                                                                  See NgPlural for more details and example.

                                                                                                                                                constructor

                                                                                                                                                constructor(
                                                                                                                                                value: string,
                                                                                                                                                template: any,
                                                                                                                                                viewContainer: any,
                                                                                                                                                ngPlural: NgPlural
                                                                                                                                                );

                                                                                                                                                  property value

                                                                                                                                                  value: string;

                                                                                                                                                    class NgStyle

                                                                                                                                                    class NgStyle implements DoCheck {}
                                                                                                                                                    • CommonModule

                                                                                                                                                      Set the font of the containing element to the result of an expression.

                                                                                                                                                      <some-element [ngStyle]="{'font-style': styleExp}">...</some-element>

                                                                                                                                                      Set the width of the containing element to a pixel value returned by an expression.

                                                                                                                                                      <some-element [ngStyle]="{'max-width.px': widthExp}">...</some-element>

                                                                                                                                                      Set a collection of style values using an expression that returns key-value pairs.

                                                                                                                                                      <some-element [ngStyle]="objExp">...</some-element>

                                                                                                                                                      An attribute directive that updates styles for the containing HTML element. Sets one or more style properties, specified as colon-separated key-value pairs. The key is a style name, with an optional .<unit> suffix (such as 'top.px', 'font-style.em'). The value is an expression to be evaluated. The resulting non-null value, expressed in the given unit, is assigned to the given style property. If the result of evaluation is null, the corresponding style is removed.

                                                                                                                                                    constructor

                                                                                                                                                    constructor(_ngEl: any, _differs: any, _renderer: any);

                                                                                                                                                      method ngDoCheck

                                                                                                                                                      ngDoCheck: () => void;

                                                                                                                                                        class NgSwitch

                                                                                                                                                        class NgSwitch {}
                                                                                                                                                        • CommonModule

                                                                                                                                                          The [ngSwitch] directive on a container specifies an expression to match against. The expressions to match are provided by ngSwitchCase directives on views within the container. - Every view that matches is rendered. - If there are no matches, a view with the ngSwitchDefault directive is rendered. - Elements within the [NgSwitch] statement but outside of any NgSwitchCase or ngSwitchDefault directive are preserved at the location.

                                                                                                                                                          Define a container element for the directive, and specify the switch expression to match against as an attribute:

                                                                                                                                                          <container-element [ngSwitch]="switch_expression">

                                                                                                                                                          Within the container, *ngSwitchCase statements specify the match expressions as attributes. Include *ngSwitchDefault as the final case.

                                                                                                                                                          <container-element [ngSwitch]="switch_expression">
                                                                                                                                                          <some-element *ngSwitchCase="match_expression_1">...</some-element>
                                                                                                                                                          ...
                                                                                                                                                          <some-element *ngSwitchDefault>...</some-element>
                                                                                                                                                          </container-element>

                                                                                                                                                          ### Usage Examples

                                                                                                                                                          The following example shows how to use more than one case to display the same view:

                                                                                                                                                          <container-element [ngSwitch]="switch_expression">
                                                                                                                                                          <!-- the same view can be shown in more than one case -->
                                                                                                                                                          <some-element *ngSwitchCase="match_expression_1">...</some-element>
                                                                                                                                                          <some-element *ngSwitchCase="match_expression_2">...</some-element>
                                                                                                                                                          <some-other-element *ngSwitchCase="match_expression_3">...</some-other-element>
                                                                                                                                                          <!--default case when there are no matches -->
                                                                                                                                                          <some-element *ngSwitchDefault>...</some-element>
                                                                                                                                                          </container-element>

                                                                                                                                                          The following example shows how cases can be nested:

                                                                                                                                                          <container-element [ngSwitch]="switch_expression">
                                                                                                                                                          <some-element *ngSwitchCase="match_expression_1">...</some-element>
                                                                                                                                                          <some-element *ngSwitchCase="match_expression_2">...</some-element>
                                                                                                                                                          <some-other-element *ngSwitchCase="match_expression_3">...</some-other-element>
                                                                                                                                                          <ng-container *ngSwitchCase="match_expression_3">
                                                                                                                                                          <!-- use a ng-container to group multiple root nodes -->
                                                                                                                                                          <inner-element></inner-element>
                                                                                                                                                          <inner-other-element></inner-other-element>
                                                                                                                                                          </ng-container>
                                                                                                                                                          <some-element *ngSwitchDefault>...</some-element>
                                                                                                                                                          </container-element>

                                                                                                                                                          See Also

                                                                                                                                                          • NgSwitchCase

                                                                                                                                                          • NgSwitchDefault

                                                                                                                                                          • [Structural Directives](guide/structural-directives)

                                                                                                                                                        class NgSwitchCase

                                                                                                                                                        class NgSwitchCase implements DoCheck {}
                                                                                                                                                        • CommonModule

                                                                                                                                                          Provides a switch case expression to match against an enclosing ngSwitch expression. When the expressions match, the given NgSwitchCase template is rendered. If multiple match expressions match the switch expression value, all of them are displayed.

                                                                                                                                                          Within a switch container, *ngSwitchCase statements specify the match expressions as attributes. Include *ngSwitchDefault as the final case.

                                                                                                                                                          <container-element [ngSwitch]="switch_expression">
                                                                                                                                                          <some-element *ngSwitchCase="match_expression_1">...</some-element>
                                                                                                                                                          ...
                                                                                                                                                          <some-element *ngSwitchDefault>...</some-element>
                                                                                                                                                          </container-element>

                                                                                                                                                          Each switch-case statement contains an in-line HTML template or template reference that defines the subtree to be selected if the value of the match expression matches the value of the switch expression.

                                                                                                                                                          Unlike JavaScript, which uses strict equality, Angular uses loose equality. This means that the empty string, "" matches 0.

                                                                                                                                                          See Also

                                                                                                                                                          • NgSwitch

                                                                                                                                                          • NgSwitchDefault

                                                                                                                                                        constructor

                                                                                                                                                        constructor(viewContainer: any, templateRef: any, ngSwitch: NgSwitch);

                                                                                                                                                          property ngSwitchCase

                                                                                                                                                          ngSwitchCase: any;
                                                                                                                                                          • Stores the HTML template to be selected on match.

                                                                                                                                                          method ngDoCheck

                                                                                                                                                          ngDoCheck: () => void;
                                                                                                                                                          • Performs case matching. For internal use only.

                                                                                                                                                          class NgSwitchDefault

                                                                                                                                                          class NgSwitchDefault {}
                                                                                                                                                          • CommonModule

                                                                                                                                                            Creates a view that is rendered when no NgSwitchCase expressions match the NgSwitch expression. This statement should be the final case in an NgSwitch.

                                                                                                                                                            See Also

                                                                                                                                                            • NgSwitch

                                                                                                                                                            • NgSwitchCase

                                                                                                                                                          constructor

                                                                                                                                                          constructor(viewContainer: any, templateRef: any, ngSwitch: NgSwitch);

                                                                                                                                                            class NgTemplateOutlet

                                                                                                                                                            class NgTemplateOutlet implements OnChanges {}
                                                                                                                                                            • CommonModule

                                                                                                                                                              Inserts an embedded view from a prepared TemplateRef.

                                                                                                                                                              You can attach a context object to the EmbeddedViewRef by setting [ngTemplateOutletContext]. [ngTemplateOutletContext] should be an object, the object's keys will be available for binding by the local template let declarations.

                                                                                                                                                              <ng-container *ngTemplateOutlet="templateRefExp; context: contextExp"></ng-container>

                                                                                                                                                              Using the key $implicit in the context object will set its value as default.

                                                                                                                                                              ### Example

                                                                                                                                                            constructor

                                                                                                                                                            constructor(_viewContainerRef: any);

                                                                                                                                                              property ngTemplateOutlet

                                                                                                                                                              ngTemplateOutlet: any;
                                                                                                                                                              • A string defining the template reference and optionally the context object for the template.

                                                                                                                                                              property ngTemplateOutletContext

                                                                                                                                                              ngTemplateOutletContext: Object;
                                                                                                                                                              • A context object to attach to the EmbeddedViewRef. This should be an object, the object's keys will be available for binding by the local template let declarations. Using the key $implicit in the context object will set its value as default.

                                                                                                                                                              method ngOnChanges

                                                                                                                                                              ngOnChanges: (changes: any) => void;

                                                                                                                                                                class ɵBrowserPlatformLocation

                                                                                                                                                                class ɵBrowserPlatformLocation extends PlatformLocation {}
                                                                                                                                                                • PlatformLocation encapsulates all of the direct calls to platform APIs. This class should not be used directly by an application developer. Instead, use Location.

                                                                                                                                                                constructor

                                                                                                                                                                constructor(_doc: any);

                                                                                                                                                                  property hash

                                                                                                                                                                  readonly hash: string;

                                                                                                                                                                    property hostname

                                                                                                                                                                    readonly hostname: string;

                                                                                                                                                                      property href

                                                                                                                                                                      readonly href: string;

                                                                                                                                                                        property location

                                                                                                                                                                        readonly location: Location;

                                                                                                                                                                          property pathname

                                                                                                                                                                          pathname: string;

                                                                                                                                                                            property port

                                                                                                                                                                            readonly port: string;

                                                                                                                                                                              property protocol

                                                                                                                                                                              readonly protocol: string;

                                                                                                                                                                                property search

                                                                                                                                                                                readonly search: string;

                                                                                                                                                                                  method back

                                                                                                                                                                                  back: () => void;

                                                                                                                                                                                    method forward

                                                                                                                                                                                    forward: () => void;

                                                                                                                                                                                      method getBaseHrefFromDOM

                                                                                                                                                                                      getBaseHrefFromDOM: () => string;

                                                                                                                                                                                        method getState

                                                                                                                                                                                        getState: () => unknown;

                                                                                                                                                                                          method historyGo

                                                                                                                                                                                          historyGo: (relativePosition?: number) => void;

                                                                                                                                                                                            method onHashChange

                                                                                                                                                                                            onHashChange: (fn: LocationChangeListener) => VoidFunction;

                                                                                                                                                                                              method onPopState

                                                                                                                                                                                              onPopState: (fn: LocationChangeListener) => VoidFunction;

                                                                                                                                                                                                method pushState

                                                                                                                                                                                                pushState: (state: any, title: string, url: string) => void;

                                                                                                                                                                                                  method replaceState

                                                                                                                                                                                                  replaceState: (state: any, title: string, url: string) => void;

                                                                                                                                                                                                    class ɵDomAdapter

                                                                                                                                                                                                    abstract class ɵDomAdapter {}
                                                                                                                                                                                                    • Provides DOM operations in an environment-agnostic way.

                                                                                                                                                                                                      Tread carefully! Interacting with the DOM directly is dangerous and can introduce XSS risks.

                                                                                                                                                                                                    property supportsDOMEvents

                                                                                                                                                                                                    abstract readonly supportsDOMEvents: boolean;

                                                                                                                                                                                                      method createElement

                                                                                                                                                                                                      abstract createElement: (tagName: any, doc?: any) => HTMLElement;

                                                                                                                                                                                                        method createHtmlDocument

                                                                                                                                                                                                        abstract createHtmlDocument: () => HTMLDocument;

                                                                                                                                                                                                          method dispatchEvent

                                                                                                                                                                                                          abstract dispatchEvent: (el: any, evt: any) => any;

                                                                                                                                                                                                            method getBaseHref

                                                                                                                                                                                                            abstract getBaseHref: (doc: Document) => string | null;

                                                                                                                                                                                                              method getCookie

                                                                                                                                                                                                              abstract getCookie: (name: string) => string | null;

                                                                                                                                                                                                                method getDefaultDocument

                                                                                                                                                                                                                abstract getDefaultDocument: () => Document;

                                                                                                                                                                                                                  method getGlobalEventTarget

                                                                                                                                                                                                                  abstract getGlobalEventTarget: (doc: Document, target: string) => any;

                                                                                                                                                                                                                    method getUserAgent

                                                                                                                                                                                                                    abstract getUserAgent: () => string;

                                                                                                                                                                                                                      method isElementNode

                                                                                                                                                                                                                      abstract isElementNode: (node: any) => boolean;

                                                                                                                                                                                                                        method isShadowRoot

                                                                                                                                                                                                                        abstract isShadowRoot: (node: any) => boolean;

                                                                                                                                                                                                                          method onAndCancel

                                                                                                                                                                                                                          abstract onAndCancel: (el: any, evt: any, listener: any) => Function;

                                                                                                                                                                                                                            method remove

                                                                                                                                                                                                                            abstract remove: (el: any) => void;

                                                                                                                                                                                                                              method resetBaseElement

                                                                                                                                                                                                                              abstract resetBaseElement: () => void;

                                                                                                                                                                                                                                class ɵNullViewportScroller

                                                                                                                                                                                                                                class ɵNullViewportScroller implements ViewportScroller {}
                                                                                                                                                                                                                                • Provides an empty implementation of the viewport scroller.

                                                                                                                                                                                                                                method getScrollPosition

                                                                                                                                                                                                                                getScrollPosition: () => [number, number];
                                                                                                                                                                                                                                • Empty implementation

                                                                                                                                                                                                                                method scrollToAnchor

                                                                                                                                                                                                                                scrollToAnchor: (anchor: string) => void;
                                                                                                                                                                                                                                • Empty implementation

                                                                                                                                                                                                                                method scrollToPosition

                                                                                                                                                                                                                                scrollToPosition: (position: [number, number]) => void;
                                                                                                                                                                                                                                • Empty implementation

                                                                                                                                                                                                                                method setHistoryScrollRestoration

                                                                                                                                                                                                                                setHistoryScrollRestoration: (scrollRestoration: 'auto' | 'manual') => void;
                                                                                                                                                                                                                                • Empty implementation

                                                                                                                                                                                                                                method setOffset

                                                                                                                                                                                                                                setOffset: (offset: [number, number] | (() => [number, number])) => void;
                                                                                                                                                                                                                                • Empty implementation

                                                                                                                                                                                                                                class PathLocationStrategy

                                                                                                                                                                                                                                class PathLocationStrategy extends LocationStrategy implements OnDestroy {}
                                                                                                                                                                                                                                • A LocationStrategy used to configure the Location service to represent its state in the [path](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax) of the browser's URL.

                                                                                                                                                                                                                                  If you're using PathLocationStrategy, you must provide a APP_BASE_HREF or add a <base href> element to the document.

                                                                                                                                                                                                                                  For instance, if you provide an APP_BASE_HREF of '/my/app/' and call location.go('/foo'), the browser's URL will become example.com/my/app/foo. To ensure all relative URIs resolve correctly, the <base href> and/or APP_BASE_HREF should end with a /.

                                                                                                                                                                                                                                  Similarly, if you add <base href='/my/app/'/> to the document and call location.go('/foo'), the browser's URL will become example.com/my/app/foo.

                                                                                                                                                                                                                                  Note that when using PathLocationStrategy, neither the query nor the fragment in the <base href> will be preserved, as outlined by the [RFC](https://tools.ietf.org/html/rfc3986#section-5.2.2).

                                                                                                                                                                                                                                  ### Example

                                                                                                                                                                                                                                constructor

                                                                                                                                                                                                                                constructor(_platformLocation: PlatformLocation, href?: string);

                                                                                                                                                                                                                                  method back

                                                                                                                                                                                                                                  back: () => void;

                                                                                                                                                                                                                                    method forward

                                                                                                                                                                                                                                    forward: () => void;

                                                                                                                                                                                                                                      method getBaseHref

                                                                                                                                                                                                                                      getBaseHref: () => string;

                                                                                                                                                                                                                                        method historyGo

                                                                                                                                                                                                                                        historyGo: (relativePosition?: number) => void;

                                                                                                                                                                                                                                          method ngOnDestroy

                                                                                                                                                                                                                                          ngOnDestroy: () => void;

                                                                                                                                                                                                                                            method onPopState

                                                                                                                                                                                                                                            onPopState: (fn: LocationChangeListener) => void;

                                                                                                                                                                                                                                              method path

                                                                                                                                                                                                                                              path: (includeHash?: boolean) => string;

                                                                                                                                                                                                                                                method prepareExternalUrl

                                                                                                                                                                                                                                                prepareExternalUrl: (internal: string) => string;

                                                                                                                                                                                                                                                  method pushState

                                                                                                                                                                                                                                                  pushState: (state: any, title: string, url: string, queryParams: string) => void;

                                                                                                                                                                                                                                                    method replaceState

                                                                                                                                                                                                                                                    replaceState: (
                                                                                                                                                                                                                                                    state: any,
                                                                                                                                                                                                                                                    title: string,
                                                                                                                                                                                                                                                    url: string,
                                                                                                                                                                                                                                                    queryParams: string
                                                                                                                                                                                                                                                    ) => void;

                                                                                                                                                                                                                                                      class PercentPipe

                                                                                                                                                                                                                                                      class PercentPipe implements PipeTransform {}
                                                                                                                                                                                                                                                      • CommonModule

                                                                                                                                                                                                                                                        Transforms a number to a percentage string, formatted according to locale rules that determine group sizing and separator, decimal-point character, and other locale-specific configurations.

                                                                                                                                                                                                                                                        See Also

                                                                                                                                                                                                                                                        • formatPercent()

                                                                                                                                                                                                                                                          The following code shows how the pipe transforms numbers into text strings, according to various format specifications, where the caller's default locale is en-US.

                                                                                                                                                                                                                                                      constructor

                                                                                                                                                                                                                                                      constructor(_locale: string);

                                                                                                                                                                                                                                                        method transform

                                                                                                                                                                                                                                                        transform: {
                                                                                                                                                                                                                                                        (value: number | string, digitsInfo?: string, locale?: string):
                                                                                                                                                                                                                                                        | string
                                                                                                                                                                                                                                                        | null;
                                                                                                                                                                                                                                                        (value: null, digitsInfo?: string, locale?: string): null;
                                                                                                                                                                                                                                                        (value: string | number, digitsInfo?: string, locale?: string): string;
                                                                                                                                                                                                                                                        };
                                                                                                                                                                                                                                                        • Parameter value

                                                                                                                                                                                                                                                          The number to be formatted as a percentage.

                                                                                                                                                                                                                                                          Parameter digitsInfo

                                                                                                                                                                                                                                                          Decimal representation options, specified by a string in the following format: {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. - minIntegerDigits: The minimum number of integer digits before the decimal point. Default is 1. - minFractionDigits: The minimum number of digits after the decimal point. Default is 0. - maxFractionDigits: The maximum number of digits after the decimal point. Default is 0.

                                                                                                                                                                                                                                                          Parameter locale

                                                                                                                                                                                                                                                          A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default. See [Setting your app locale](guide/i18n#setting-up-the-locale-of-your-app).

                                                                                                                                                                                                                                                        class PlatformLocation

                                                                                                                                                                                                                                                        abstract class PlatformLocation {}
                                                                                                                                                                                                                                                        • This class should not be used directly by an application developer. Instead, use Location.

                                                                                                                                                                                                                                                          PlatformLocation encapsulates all calls to DOM APIs, which allows the Router to be platform-agnostic. This means that we can have different implementation of PlatformLocation for the different platforms that Angular supports. For example, @angular/platform-browser provides an implementation specific to the browser environment, while @angular/platform-server provides one suitable for use with server-side rendering.

                                                                                                                                                                                                                                                          The PlatformLocation class is used directly by all implementations of LocationStrategy when they need to interact with the DOM APIs like pushState, popState, etc.

                                                                                                                                                                                                                                                          LocationStrategy in turn is used by the Location service which is used directly by the Router in order to navigate between routes. Since all interactions between Router / Location / LocationStrategy and DOM APIs flow through the PlatformLocation class, they are all platform-agnostic.

                                                                                                                                                                                                                                                        property hash

                                                                                                                                                                                                                                                        readonly hash: string;

                                                                                                                                                                                                                                                          property hostname

                                                                                                                                                                                                                                                          readonly hostname: string;

                                                                                                                                                                                                                                                            property href

                                                                                                                                                                                                                                                            readonly href: string;

                                                                                                                                                                                                                                                              property pathname

                                                                                                                                                                                                                                                              readonly pathname: string;

                                                                                                                                                                                                                                                                property port

                                                                                                                                                                                                                                                                readonly port: string;

                                                                                                                                                                                                                                                                  property protocol

                                                                                                                                                                                                                                                                  readonly protocol: string;

                                                                                                                                                                                                                                                                    property search

                                                                                                                                                                                                                                                                    readonly search: string;

                                                                                                                                                                                                                                                                      method back

                                                                                                                                                                                                                                                                      abstract back: () => void;

                                                                                                                                                                                                                                                                        method forward

                                                                                                                                                                                                                                                                        abstract forward: () => void;

                                                                                                                                                                                                                                                                          method getBaseHrefFromDOM

                                                                                                                                                                                                                                                                          abstract getBaseHrefFromDOM: () => string;

                                                                                                                                                                                                                                                                            method getState

                                                                                                                                                                                                                                                                            abstract getState: () => unknown;

                                                                                                                                                                                                                                                                              method historyGo

                                                                                                                                                                                                                                                                              historyGo: (relativePosition: number) => void;

                                                                                                                                                                                                                                                                                method onHashChange

                                                                                                                                                                                                                                                                                abstract onHashChange: (fn: LocationChangeListener) => VoidFunction;
                                                                                                                                                                                                                                                                                • Returns a function that, when executed, removes the hashchange event handler.

                                                                                                                                                                                                                                                                                method onPopState

                                                                                                                                                                                                                                                                                abstract onPopState: (fn: LocationChangeListener) => VoidFunction;
                                                                                                                                                                                                                                                                                • Returns a function that, when executed, removes the popstate event handler.

                                                                                                                                                                                                                                                                                method pushState

                                                                                                                                                                                                                                                                                abstract pushState: (state: any, title: string, url: string) => void;

                                                                                                                                                                                                                                                                                  method replaceState

                                                                                                                                                                                                                                                                                  abstract replaceState: (state: any, title: string, url: string) => void;

                                                                                                                                                                                                                                                                                    class SlicePipe

                                                                                                                                                                                                                                                                                    class SlicePipe implements PipeTransform {}
                                                                                                                                                                                                                                                                                    • CommonModule

                                                                                                                                                                                                                                                                                      Creates a new Array or String containing a subset (slice) of the elements.

                                                                                                                                                                                                                                                                                      All behavior is based on the expected behavior of the JavaScript API Array.prototype.slice() and String.prototype.slice().

                                                                                                                                                                                                                                                                                      When operating on an Array, the returned Array is always a copy even when all the elements are being returned.

                                                                                                                                                                                                                                                                                      When operating on a blank value, the pipe returns the blank value.

                                                                                                                                                                                                                                                                                      ### List Example

                                                                                                                                                                                                                                                                                      This ngFor example:

                                                                                                                                                                                                                                                                                      produces the following:

                                                                                                                                                                                                                                                                                      <li>b</li>
                                                                                                                                                                                                                                                                                      <li>c</li>

                                                                                                                                                                                                                                                                                      ### String Examples

                                                                                                                                                                                                                                                                                    method transform

                                                                                                                                                                                                                                                                                    transform: {
                                                                                                                                                                                                                                                                                    <T>(value: ReadonlyArray<T>, start: number, end?: number): Array<T>;
                                                                                                                                                                                                                                                                                    (value: null, start: number, end?: number): null;
                                                                                                                                                                                                                                                                                    <T>(value: readonly T[], start: number, end?: number): T[];
                                                                                                                                                                                                                                                                                    (value: string, start: number, end?: number): string;
                                                                                                                                                                                                                                                                                    (value: string, start: number, end?: number): string;
                                                                                                                                                                                                                                                                                    };
                                                                                                                                                                                                                                                                                    • Parameter value

                                                                                                                                                                                                                                                                                      a list or a string to be sliced.

                                                                                                                                                                                                                                                                                      Parameter start

                                                                                                                                                                                                                                                                                      the starting index of the subset to return: - **a positive integer**: return the item at start index and all items after in the list or string expression. - **a negative integer**: return the item at start index from the end and all items after in the list or string expression. - **if positive and greater than the size of the expression**: return an empty list or string. - **if negative and greater than the size of the expression**: return entire list or string.

                                                                                                                                                                                                                                                                                      Parameter end

                                                                                                                                                                                                                                                                                      the ending index of the subset to return: - **omitted**: return all items until the end. - **if positive**: return all items before end index of the list or string. - **if negative**: return all items before end index from the end of the list or string.

                                                                                                                                                                                                                                                                                    class TitleCasePipe

                                                                                                                                                                                                                                                                                    class TitleCasePipe implements PipeTransform {}
                                                                                                                                                                                                                                                                                    • Transforms text to title case. Capitalizes the first letter of each word and transforms the rest of the word to lower case. Words are delimited by any whitespace character, such as a space, tab, or line-feed character.

                                                                                                                                                                                                                                                                                      See Also

                                                                                                                                                                                                                                                                                      • LowerCasePipe

                                                                                                                                                                                                                                                                                      • UpperCasePipe

                                                                                                                                                                                                                                                                                        The following example shows the result of transforming various strings into title case.

                                                                                                                                                                                                                                                                                        CommonModule

                                                                                                                                                                                                                                                                                    method transform

                                                                                                                                                                                                                                                                                    transform: {
                                                                                                                                                                                                                                                                                    (value: string): string;
                                                                                                                                                                                                                                                                                    (value: null): null;
                                                                                                                                                                                                                                                                                    (value: string): string;
                                                                                                                                                                                                                                                                                    };
                                                                                                                                                                                                                                                                                    • Parameter value

                                                                                                                                                                                                                                                                                      The string to transform to title case.

                                                                                                                                                                                                                                                                                    class UpperCasePipe

                                                                                                                                                                                                                                                                                    class UpperCasePipe implements PipeTransform {}
                                                                                                                                                                                                                                                                                    • Transforms text to all upper case.

                                                                                                                                                                                                                                                                                      See Also

                                                                                                                                                                                                                                                                                      • LowerCasePipe

                                                                                                                                                                                                                                                                                      • TitleCasePipe

                                                                                                                                                                                                                                                                                        CommonModule

                                                                                                                                                                                                                                                                                    method transform

                                                                                                                                                                                                                                                                                    transform: {
                                                                                                                                                                                                                                                                                    (value: string): string;
                                                                                                                                                                                                                                                                                    (value: null): null;
                                                                                                                                                                                                                                                                                    (value: string): string;
                                                                                                                                                                                                                                                                                    };
                                                                                                                                                                                                                                                                                    • Parameter value

                                                                                                                                                                                                                                                                                      The string to transform to upper case.

                                                                                                                                                                                                                                                                                    class ViewportScroller

                                                                                                                                                                                                                                                                                    abstract class ViewportScroller {}
                                                                                                                                                                                                                                                                                    • Defines a scroll position manager. Implemented by BrowserViewportScroller.

                                                                                                                                                                                                                                                                                    property ɵprov

                                                                                                                                                                                                                                                                                    static ɵprov: {};

                                                                                                                                                                                                                                                                                    method getScrollPosition

                                                                                                                                                                                                                                                                                    abstract getScrollPosition: () => [number, number];
                                                                                                                                                                                                                                                                                    • Retrieves the current scroll position.

                                                                                                                                                                                                                                                                                      Returns

                                                                                                                                                                                                                                                                                      A position in screen coordinates (a tuple with x and y values).

                                                                                                                                                                                                                                                                                    method scrollToAnchor

                                                                                                                                                                                                                                                                                    abstract scrollToAnchor: (anchor: string) => void;
                                                                                                                                                                                                                                                                                    • Scrolls to an anchor element.

                                                                                                                                                                                                                                                                                      Parameter anchor

                                                                                                                                                                                                                                                                                      The ID of the anchor element.

                                                                                                                                                                                                                                                                                    method scrollToPosition

                                                                                                                                                                                                                                                                                    abstract scrollToPosition: (position: [number, number]) => void;
                                                                                                                                                                                                                                                                                    • Scrolls to a specified position.

                                                                                                                                                                                                                                                                                      Parameter position

                                                                                                                                                                                                                                                                                      A position in screen coordinates (a tuple with x and y values).

                                                                                                                                                                                                                                                                                    method setHistoryScrollRestoration

                                                                                                                                                                                                                                                                                    abstract setHistoryScrollRestoration: (
                                                                                                                                                                                                                                                                                    scrollRestoration: 'auto' | 'manual'
                                                                                                                                                                                                                                                                                    ) => void;
                                                                                                                                                                                                                                                                                    • Disables automatic scroll restoration provided by the browser. See also [window.history.scrollRestoration info](https://developers.google.com/web/updates/2015/09/history-api-scroll-restoration).

                                                                                                                                                                                                                                                                                    method setOffset

                                                                                                                                                                                                                                                                                    abstract setOffset: (
                                                                                                                                                                                                                                                                                    offset: [number, number] | (() => [number, number])
                                                                                                                                                                                                                                                                                    ) => void;
                                                                                                                                                                                                                                                                                    • Configures the top offset used when scrolling to an anchor.

                                                                                                                                                                                                                                                                                      Parameter offset

                                                                                                                                                                                                                                                                                      A position in screen coordinates (a tuple with x and y values) or a function that returns the top offset position.

                                                                                                                                                                                                                                                                                    class XhrFactory

                                                                                                                                                                                                                                                                                    abstract class XhrFactory {}
                                                                                                                                                                                                                                                                                    • A wrapper around the XMLHttpRequest constructor.

                                                                                                                                                                                                                                                                                    method build

                                                                                                                                                                                                                                                                                    abstract build: () => XMLHttpRequest;

                                                                                                                                                                                                                                                                                      Interfaces

                                                                                                                                                                                                                                                                                      interface KeyValue

                                                                                                                                                                                                                                                                                      interface KeyValue<K, V> {}
                                                                                                                                                                                                                                                                                      • A key value pair. Usually used to represent the key value pairs from a Map or Object.

                                                                                                                                                                                                                                                                                      property key

                                                                                                                                                                                                                                                                                      key: K;

                                                                                                                                                                                                                                                                                        property value

                                                                                                                                                                                                                                                                                        value: V;

                                                                                                                                                                                                                                                                                          interface LocationChangeEvent

                                                                                                                                                                                                                                                                                          interface LocationChangeEvent {}
                                                                                                                                                                                                                                                                                          • A serializable version of the event from onPopState or onHashChange

                                                                                                                                                                                                                                                                                          property state

                                                                                                                                                                                                                                                                                          state: any;

                                                                                                                                                                                                                                                                                            property type

                                                                                                                                                                                                                                                                                            type: string;

                                                                                                                                                                                                                                                                                              interface LocationChangeListener

                                                                                                                                                                                                                                                                                              interface LocationChangeListener {}

                                                                                                                                                                                                                                                                                              call signature

                                                                                                                                                                                                                                                                                              (event: LocationChangeEvent): any;

                                                                                                                                                                                                                                                                                                interface PopStateEvent

                                                                                                                                                                                                                                                                                                interface PopStateEvent {}

                                                                                                                                                                                                                                                                                                property pop

                                                                                                                                                                                                                                                                                                pop?: boolean;

                                                                                                                                                                                                                                                                                                  property state

                                                                                                                                                                                                                                                                                                  state?: any;

                                                                                                                                                                                                                                                                                                    property type

                                                                                                                                                                                                                                                                                                    type?: string;

                                                                                                                                                                                                                                                                                                      property url

                                                                                                                                                                                                                                                                                                      url?: string;

                                                                                                                                                                                                                                                                                                        Enums

                                                                                                                                                                                                                                                                                                        enum FormatWidth

                                                                                                                                                                                                                                                                                                        enum FormatWidth {
                                                                                                                                                                                                                                                                                                        Short = 0,
                                                                                                                                                                                                                                                                                                        Medium = 1,
                                                                                                                                                                                                                                                                                                        Long = 2,
                                                                                                                                                                                                                                                                                                        Full = 3,
                                                                                                                                                                                                                                                                                                        }
                                                                                                                                                                                                                                                                                                        • String widths available for date-time formats. The specific character widths are locale-specific. Examples are given for en-US.

                                                                                                                                                                                                                                                                                                          See Also

                                                                                                                                                                                                                                                                                                          • getLocaleDateFormat()

                                                                                                                                                                                                                                                                                                          • getLocaleTimeFormat()

                                                                                                                                                                                                                                                                                                          • getLocaleDateTimeFormat()

                                                                                                                                                                                                                                                                                                          • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

                                                                                                                                                                                                                                                                                                        member Full

                                                                                                                                                                                                                                                                                                        Full = 3
                                                                                                                                                                                                                                                                                                        • For en-US, 'EEEE, MMMM d, y, h:mm:ss a zzzz' (Example: Monday, June 15, 2015 at 9:03:01 AM GMT+01:00)

                                                                                                                                                                                                                                                                                                        member Long

                                                                                                                                                                                                                                                                                                        Long = 2
                                                                                                                                                                                                                                                                                                        • For en-US, 'MMMM d, y, h:mm:ss a z' (Example: June 15, 2015 at 9:03:01 AM GMT+1)

                                                                                                                                                                                                                                                                                                        member Medium

                                                                                                                                                                                                                                                                                                        Medium = 1
                                                                                                                                                                                                                                                                                                        • For en-US, 'MMM d, y, h:mm:ss a' (Example: Jun 15, 2015, 9:03:01 AM)

                                                                                                                                                                                                                                                                                                        member Short

                                                                                                                                                                                                                                                                                                        Short = 0
                                                                                                                                                                                                                                                                                                        • For en-US, 'M/d/yy, h:mm a'` (Example: 6/15/15, 9:03 AM)

                                                                                                                                                                                                                                                                                                        enum FormStyle

                                                                                                                                                                                                                                                                                                        enum FormStyle {
                                                                                                                                                                                                                                                                                                        Format = 0,
                                                                                                                                                                                                                                                                                                        Standalone = 1,
                                                                                                                                                                                                                                                                                                        }
                                                                                                                                                                                                                                                                                                        • Context-dependant translation forms for strings. Typically the standalone version is for the nominative form of the word, and the format version is used for the genitive case.

                                                                                                                                                                                                                                                                                                          See Also

                                                                                                                                                                                                                                                                                                          • [CLDR website](http://cldr.unicode.org/translation/date-time-1/date-time#TOC-Standalone-vs.-Format-Styles)

                                                                                                                                                                                                                                                                                                          • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

                                                                                                                                                                                                                                                                                                        member Format

                                                                                                                                                                                                                                                                                                        Format = 0

                                                                                                                                                                                                                                                                                                          member Standalone

                                                                                                                                                                                                                                                                                                          Standalone = 1

                                                                                                                                                                                                                                                                                                            enum NumberFormatStyle

                                                                                                                                                                                                                                                                                                            enum NumberFormatStyle {
                                                                                                                                                                                                                                                                                                            Decimal = 0,
                                                                                                                                                                                                                                                                                                            Percent = 1,
                                                                                                                                                                                                                                                                                                            Currency = 2,
                                                                                                                                                                                                                                                                                                            Scientific = 3,
                                                                                                                                                                                                                                                                                                            }
                                                                                                                                                                                                                                                                                                            • Format styles that can be used to represent numbers.

                                                                                                                                                                                                                                                                                                              See Also

                                                                                                                                                                                                                                                                                                              • getLocaleNumberFormat().

                                                                                                                                                                                                                                                                                                              • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

                                                                                                                                                                                                                                                                                                            member Currency

                                                                                                                                                                                                                                                                                                            Currency = 2

                                                                                                                                                                                                                                                                                                              member Decimal

                                                                                                                                                                                                                                                                                                              Decimal = 0

                                                                                                                                                                                                                                                                                                                member Percent

                                                                                                                                                                                                                                                                                                                Percent = 1

                                                                                                                                                                                                                                                                                                                  member Scientific

                                                                                                                                                                                                                                                                                                                  Scientific = 3

                                                                                                                                                                                                                                                                                                                    enum NumberSymbol

                                                                                                                                                                                                                                                                                                                    enum NumberSymbol {
                                                                                                                                                                                                                                                                                                                    Decimal = 0,
                                                                                                                                                                                                                                                                                                                    Group = 1,
                                                                                                                                                                                                                                                                                                                    List = 2,
                                                                                                                                                                                                                                                                                                                    PercentSign = 3,
                                                                                                                                                                                                                                                                                                                    PlusSign = 4,
                                                                                                                                                                                                                                                                                                                    MinusSign = 5,
                                                                                                                                                                                                                                                                                                                    Exponential = 6,
                                                                                                                                                                                                                                                                                                                    SuperscriptingExponent = 7,
                                                                                                                                                                                                                                                                                                                    PerMille = 8,
                                                                                                                                                                                                                                                                                                                    Infinity = 9,
                                                                                                                                                                                                                                                                                                                    NaN = 10,
                                                                                                                                                                                                                                                                                                                    TimeSeparator = 11,
                                                                                                                                                                                                                                                                                                                    CurrencyDecimal = 12,
                                                                                                                                                                                                                                                                                                                    CurrencyGroup = 13,
                                                                                                                                                                                                                                                                                                                    }
                                                                                                                                                                                                                                                                                                                    • Symbols that can be used to replace placeholders in number patterns. Examples are based on en-US values.

                                                                                                                                                                                                                                                                                                                      See Also

                                                                                                                                                                                                                                                                                                                      • getLocaleNumberSymbol()

                                                                                                                                                                                                                                                                                                                      • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

                                                                                                                                                                                                                                                                                                                    member CurrencyDecimal

                                                                                                                                                                                                                                                                                                                    CurrencyDecimal = 12
                                                                                                                                                                                                                                                                                                                    • Decimal separator for currency values (fallback to Decimal). Example: $2,345.67

                                                                                                                                                                                                                                                                                                                    member CurrencyGroup

                                                                                                                                                                                                                                                                                                                    CurrencyGroup = 13
                                                                                                                                                                                                                                                                                                                    • Group separator for currency values (fallback to Group). Example: $2,345.67

                                                                                                                                                                                                                                                                                                                    member Decimal

                                                                                                                                                                                                                                                                                                                    Decimal = 0
                                                                                                                                                                                                                                                                                                                    • Decimal separator. For en-US, the dot character. Example: 2,345.67

                                                                                                                                                                                                                                                                                                                    member Exponential

                                                                                                                                                                                                                                                                                                                    Exponential = 6
                                                                                                                                                                                                                                                                                                                    • Computer notation for exponential value (n times a power of 10). Example: 1.2E3

                                                                                                                                                                                                                                                                                                                    member Group

                                                                                                                                                                                                                                                                                                                    Group = 1
                                                                                                                                                                                                                                                                                                                    • Grouping separator, typically for thousands. For en-US, the comma character. Example: 2,345.67

                                                                                                                                                                                                                                                                                                                    member Infinity

                                                                                                                                                                                                                                                                                                                    Infinity = 9
                                                                                                                                                                                                                                                                                                                    • Infinity, can be used with plus and minus. Example: ∞, +∞, -∞

                                                                                                                                                                                                                                                                                                                    member List

                                                                                                                                                                                                                                                                                                                    List = 2
                                                                                                                                                                                                                                                                                                                    • List-item separator. Example: "one, two, and three"

                                                                                                                                                                                                                                                                                                                    member MinusSign

                                                                                                                                                                                                                                                                                                                    MinusSign = 5
                                                                                                                                                                                                                                                                                                                    • Sign for negative numbers. Example: -23

                                                                                                                                                                                                                                                                                                                    member NaN

                                                                                                                                                                                                                                                                                                                    NaN = 10
                                                                                                                                                                                                                                                                                                                    • Not a number. Example: NaN

                                                                                                                                                                                                                                                                                                                    member PercentSign

                                                                                                                                                                                                                                                                                                                    PercentSign = 3
                                                                                                                                                                                                                                                                                                                    • Sign for percentage (out of 100). Example: 23.4%

                                                                                                                                                                                                                                                                                                                    member PerMille

                                                                                                                                                                                                                                                                                                                    PerMille = 8
                                                                                                                                                                                                                                                                                                                    • Sign for permille (out of 1000). Example: 23.4‰

                                                                                                                                                                                                                                                                                                                    member PlusSign

                                                                                                                                                                                                                                                                                                                    PlusSign = 4
                                                                                                                                                                                                                                                                                                                    • Sign for positive numbers. Example: +23

                                                                                                                                                                                                                                                                                                                    member SuperscriptingExponent

                                                                                                                                                                                                                                                                                                                    SuperscriptingExponent = 7
                                                                                                                                                                                                                                                                                                                    • Human-readable format of exponential. Example: 1.2x103

                                                                                                                                                                                                                                                                                                                    member TimeSeparator

                                                                                                                                                                                                                                                                                                                    TimeSeparator = 11
                                                                                                                                                                                                                                                                                                                    • Symbol used between time units. Example: 10:52

                                                                                                                                                                                                                                                                                                                    enum Plural

                                                                                                                                                                                                                                                                                                                    enum Plural {
                                                                                                                                                                                                                                                                                                                    Zero = 0,
                                                                                                                                                                                                                                                                                                                    One = 1,
                                                                                                                                                                                                                                                                                                                    Two = 2,
                                                                                                                                                                                                                                                                                                                    Few = 3,
                                                                                                                                                                                                                                                                                                                    Many = 4,
                                                                                                                                                                                                                                                                                                                    Other = 5,
                                                                                                                                                                                                                                                                                                                    }
                                                                                                                                                                                                                                                                                                                    • Plurality cases used for translating plurals to different languages.

                                                                                                                                                                                                                                                                                                                      See Also

                                                                                                                                                                                                                                                                                                                      • NgPlural

                                                                                                                                                                                                                                                                                                                      • NgPluralCase

                                                                                                                                                                                                                                                                                                                      • [Internationalization (i18n) Guide](https://angular.io/guide/i18n)

                                                                                                                                                                                                                                                                                                                    member Few

                                                                                                                                                                                                                                                                                                                    Few = 3

                                                                                                                                                                                                                                                                                                                      member Many

                                                                                                                                                                                                                                                                                                                      Many = 4

                                                                                                                                                                                                                                                                                                                        member One

                                                                                                                                                                                                                                                                                                                        One = 1

                                                                                                                                                                                                                                                                                                                          member Other

                                                                                                                                                                                                                                                                                                                          Other = 5

                                                                                                                                                                                                                                                                                                                            member Two

                                                                                                                                                                                                                                                                                                                            Two = 2

                                                                                                                                                                                                                                                                                                                              member Zero

                                                                                                                                                                                                                                                                                                                              Zero = 0

                                                                                                                                                                                                                                                                                                                                enum TranslationWidth

                                                                                                                                                                                                                                                                                                                                enum TranslationWidth {
                                                                                                                                                                                                                                                                                                                                Narrow = 0,
                                                                                                                                                                                                                                                                                                                                Abbreviated = 1,
                                                                                                                                                                                                                                                                                                                                Wide = 2,
                                                                                                                                                                                                                                                                                                                                Short = 3,
                                                                                                                                                                                                                                                                                                                                }
                                                                                                                                                                                                                                                                                                                                • String widths available for translations. The specific character widths are locale-specific. Examples are given for the word "Sunday" in English.

                                                                                                                                                                                                                                                                                                                                member Abbreviated

                                                                                                                                                                                                                                                                                                                                Abbreviated = 1
                                                                                                                                                                                                                                                                                                                                • 3 characters for en-US. For example: 'Sun'

                                                                                                                                                                                                                                                                                                                                member Narrow

                                                                                                                                                                                                                                                                                                                                Narrow = 0
                                                                                                                                                                                                                                                                                                                                • 1 character for en-US. For example: 'S'

                                                                                                                                                                                                                                                                                                                                member Short

                                                                                                                                                                                                                                                                                                                                Short = 3
                                                                                                                                                                                                                                                                                                                                • 2 characters for en-US, For example: "Su"

                                                                                                                                                                                                                                                                                                                                member Wide

                                                                                                                                                                                                                                                                                                                                Wide = 2
                                                                                                                                                                                                                                                                                                                                • Full length for en-US. For example: "Sunday"

                                                                                                                                                                                                                                                                                                                                enum WeekDay

                                                                                                                                                                                                                                                                                                                                enum WeekDay {
                                                                                                                                                                                                                                                                                                                                Sunday = 0,
                                                                                                                                                                                                                                                                                                                                Monday = 1,
                                                                                                                                                                                                                                                                                                                                Tuesday = 2,
                                                                                                                                                                                                                                                                                                                                Wednesday = 3,
                                                                                                                                                                                                                                                                                                                                Thursday = 4,
                                                                                                                                                                                                                                                                                                                                Friday = 5,
                                                                                                                                                                                                                                                                                                                                Saturday = 6,
                                                                                                                                                                                                                                                                                                                                }
                                                                                                                                                                                                                                                                                                                                • The value for each day of the week, based on the en-US locale

                                                                                                                                                                                                                                                                                                                                member Friday

                                                                                                                                                                                                                                                                                                                                Friday = 5

                                                                                                                                                                                                                                                                                                                                  member Monday

                                                                                                                                                                                                                                                                                                                                  Monday = 1

                                                                                                                                                                                                                                                                                                                                    member Saturday

                                                                                                                                                                                                                                                                                                                                    Saturday = 6

                                                                                                                                                                                                                                                                                                                                      member Sunday

                                                                                                                                                                                                                                                                                                                                      Sunday = 0

                                                                                                                                                                                                                                                                                                                                        member Thursday

                                                                                                                                                                                                                                                                                                                                        Thursday = 4

                                                                                                                                                                                                                                                                                                                                          member Tuesday

                                                                                                                                                                                                                                                                                                                                          Tuesday = 2

                                                                                                                                                                                                                                                                                                                                            member Wednesday

                                                                                                                                                                                                                                                                                                                                            Wednesday = 3

                                                                                                                                                                                                                                                                                                                                              Type Aliases

                                                                                                                                                                                                                                                                                                                                              type Time

                                                                                                                                                                                                                                                                                                                                              type Time = {
                                                                                                                                                                                                                                                                                                                                              hours: number;
                                                                                                                                                                                                                                                                                                                                              minutes: number;
                                                                                                                                                                                                                                                                                                                                              };
                                                                                                                                                                                                                                                                                                                                              • Represents a time value with hours and minutes.

                                                                                                                                                                                                                                                                                                                                              Package Files (1)

                                                                                                                                                                                                                                                                                                                                              Dependencies (1)

                                                                                                                                                                                                                                                                                                                                              Dev Dependencies (0)

                                                                                                                                                                                                                                                                                                                                              No dev dependencies.

                                                                                                                                                                                                                                                                                                                                              Peer Dependencies (2)

                                                                                                                                                                                                                                                                                                                                              Badge

                                                                                                                                                                                                                                                                                                                                              To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                                                                                                                                                                                              You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@angular/common.

                                                                                                                                                                                                                                                                                                                                              • Markdown
                                                                                                                                                                                                                                                                                                                                                [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@angular/common)
                                                                                                                                                                                                                                                                                                                                              • HTML
                                                                                                                                                                                                                                                                                                                                                <a href="https://www.jsdocs.io/package/@angular/common"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>