/** * @license Angular v16.2.12 * (c) 2010-2022 Google LLC. https://angular.io/ * License: MIT */ import { ChangeDetectorRef } from '@angular/core'; import { DoCheck } from '@angular/core'; import { ElementRef } from '@angular/core'; import * as i0 from '@angular/core'; import { InjectionToken } from '@angular/core'; import { Injector } from '@angular/core'; import { IterableDiffers } from '@angular/core'; import { KeyValueDiffers } from '@angular/core'; import { NgIterable } from '@angular/core'; import { NgModuleFactory } from '@angular/core'; import { Observable } from 'rxjs'; import { OnChanges } from '@angular/core'; import { OnDestroy } from '@angular/core'; import { OnInit } from '@angular/core'; import { PipeTransform } from '@angular/core'; import { Provider } from '@angular/core'; import { Renderer2 } from '@angular/core'; import { SimpleChanges } from '@angular/core'; import { Subscribable } from 'rxjs'; import { SubscriptionLike } from 'rxjs'; import { TemplateRef } from '@angular/core'; import { TrackByFunction } from '@angular/core'; import { Type } from '@angular/core'; import { Version } from '@angular/core'; import { ViewContainerRef } from '@angular/core'; /** * 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. * * @usageNotes * * 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. * * ```typescript * import {NgModule} from '@angular/core'; * import {APP_BASE_HREF} from '@angular/common'; * * @NgModule({ * providers: [{provide: APP_BASE_HREF, useValue: '/my/app'}] * }) * class AppModule {} * ``` * * @publicApi */ export declare const APP_BASE_HREF: InjectionToken; /** * @ngModule CommonModule * @description * * 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. When the reference of the expression changes, the `async` pipe * automatically unsubscribes from the old `Observable` or `Promise` and subscribes to the new one. * * @usageNotes * * ### Examples * * This example binds a `Promise` to the view. Clicking the `Resolve` button resolves the * promise. * * {@example common/pipes/ts/async_pipe.ts region='AsyncPipePromise'} * * 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. * * {@example common/pipes/ts/async_pipe.ts region='AsyncPipeObservable'} * * @publicApi */ export declare class AsyncPipe implements OnDestroy, PipeTransform { private _ref; private _latestValue; private _subscription; private _obj; private _strategy; constructor(ref: ChangeDetectorRef); ngOnDestroy(): void; transform(obj: Observable | Subscribable | Promise): T | null; transform(obj: null | undefined): null; transform(obj: Observable | Subscribable | Promise | null | undefined): T | null; private _subscribe; private _selectStrategy; private _dispose; private _updateLatestValue; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * `PlatformLocation` encapsulates all of the direct calls to platform APIs. * This class should not be used directly by an application developer. Instead, use * {@link Location}. * * @publicApi */ export declare class BrowserPlatformLocation extends PlatformLocation { private _location; private _history; private _doc; constructor(); getBaseHrefFromDOM(): string; onPopState(fn: LocationChangeListener): VoidFunction; onHashChange(fn: LocationChangeListener): VoidFunction; get href(): string; get protocol(): string; get hostname(): string; get port(): string; get pathname(): string; get search(): string; get hash(): string; set pathname(newPath: string); pushState(state: any, title: string, url: string): void; replaceState(state: any, title: string, url: string): void; forward(): void; back(): void; historyGo(relativePosition?: number): void; getState(): unknown; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * 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. * * @publicApi */ export declare class CommonModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } /** * @ngModule CommonModule * @description * * 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. * * * @see {@link getCurrencySymbol} * @see {@link formatCurrency} * * @usageNotes * 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`. * * * * @publicApi */ export declare class CurrencyPipe implements PipeTransform { private _locale; private _defaultCurrencyCode; constructor(_locale: string, _defaultCurrencyCode?: string); transform(value: number | string, currencyCode?: string, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): string | null; transform(value: null | undefined, currencyCode?: string, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): null; transform(value: number | string | null | undefined, currencyCode?: string, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * DI token that allows to provide default configuration for the `DatePipe` instances in an * application. The value is an object which can include the following fields: * - `dateFormat`: configures the default date format. If not provided, the `DatePipe` * will use the 'mediumDate' as a value. * - `timezone`: configures the default timezone. If not provided, the `DatePipe` will * use the end-user's local system timezone. * * @see {@link DatePipeConfig} * * @usageNotes * * Various date pipe default values can be overwritten by providing this token with * the value that has this interface. * * For example: * * Override the default date format by providing a value using the token: * ```typescript * providers: [ * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {dateFormat: 'shortDate'}} * ] * ``` * * Override the default timezone by providing a value using the token: * ```typescript * providers: [ * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {timezone: '-1200'}} * ] * ``` */ export declare const DATE_PIPE_DEFAULT_OPTIONS: InjectionToken; /** * Optionally-provided default timezone to use for all instances of `DatePipe` (such as `'+0430'`). * If the value isn't provided, the `DatePipe` will use the end-user's local system timezone. * * @deprecated use DATE_PIPE_DEFAULT_OPTIONS token to configure DatePipe */ export declare const DATE_PIPE_DEFAULT_TIMEZONE: InjectionToken; /** * @ngModule CommonModule * @description * * 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-common-format-data-locale) for more information. * * The time zone of the formatted value can be specified either by passing it in as the second * parameter of the pipe, or by setting the default through the `DATE_PIPE_DEFAULT_OPTIONS` * injection token. The value that is passed in as the second parameter takes precedence over * the one defined using the injection token. * * @see {@link formatDate} * * * @usageNotes * * 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' * {{ dateObj | date:"MMM dd, yyyy 'at' hh:mm a" }} // output is 'Jun 15, 2015 at 09:43 PM' * ``` * * ### Usage example * * The following component uses a date pipe to display the current date in different formats. * * ``` * @Component({ * selector: 'date-pipe', * template: `
*

Today is {{today | date}}

*

Or if you prefer, {{today | date:'fullDate'}}

*

The time is {{today | date:'h:mm a z'}}

*
` * }) * // Get the current date and time as a date-time value. * export class DatePipeComponent { * today: number = Date.now(); * } * ``` * * @publicApi */ export declare class DatePipe implements PipeTransform { private locale; private defaultTimezone?; private defaultOptions?; constructor(locale: string, defaultTimezone?: string | null | undefined, defaultOptions?: DatePipeConfig | null | undefined); /** * @param value The date expression: a `Date` object, a number * (milliseconds since UTC epoch), or an ISO string (https://www.w3.org/TR/NOTE-datetime). * @param format The date/time components to include, using predefined options or a * custom format string. When not provided, the `DatePipe` looks for the value using the * `DATE_PIPE_DEFAULT_OPTIONS` injection token (and reads the `dateFormat` property). * If the token is not configured, the `mediumDate` is used as a value. * @param timezone A timezone offset (such as `'+0430'`), or a standard UTC/GMT, or continental US * timezone abbreviation. When not provided, the `DatePipe` looks for the value using the * `DATE_PIPE_DEFAULT_OPTIONS` injection token (and reads the `timezone` property). If the token * is not configured, the end-user's local system timezone is used as a value. * @param 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-common-locale-id). * * @see {@link DATE_PIPE_DEFAULT_OPTIONS} * * @returns A date string in the desired format. */ transform(value: Date | string | number, format?: string, timezone?: string, locale?: string): string | null; transform(value: null | undefined, format?: string, timezone?: string, locale?: string): null; transform(value: Date | string | number | null | undefined, format?: string, timezone?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * An interface that describes the date pipe configuration, which can be provided using the * `DATE_PIPE_DEFAULT_OPTIONS` token. * * @see {@link DATE_PIPE_DEFAULT_OPTIONS} * * @publicApi */ export declare interface DatePipeConfig { dateFormat: string; timezone: string; } /** * @ngModule CommonModule * @description * * 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 {@link formatNumber} * * @usageNotes * * ### 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'}} * * * {{-3.6 | number:'1.0-0'}} * * ``` * * ### 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-common-locale-id). * * ### Example * * The following code shows how the pipe transforms values * according to various format specifications, * where the caller's default locale is `en-US`. * * * * @publicApi */ export declare class DecimalPipe implements PipeTransform { private _locale; constructor(_locale: string); transform(value: number | string, digitsInfo?: string, locale?: string): string | null; transform(value: null | undefined, digitsInfo?: string, locale?: string): null; transform(value: number | string | null | undefined, digitsInfo?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } declare function defaultComparator(keyValueA: KeyValue, keyValueB: KeyValue): number; /** * A DI Token representing the main rendering context. * In a browser and SSR this is the DOM Document. * When using SSR, that document is created by [Domino](https://github.com/angular/domino). * * @publicApi */ export declare const DOCUMENT: InjectionToken; /** * @ngModule CommonModule * @description * * Formats a number as currency using locale rules. * * @param value The number to format. * @param locale A locale code for the locale format rules to use. * @param 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. * @param 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. * @param 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 {@link formatNumber} * @see {@link DecimalPipe} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function formatCurrency(value: number, locale: string, currency: string, currencyCode?: string, digitsInfo?: string): string; /** * @ngModule CommonModule * @description * * Formats a date according to locale rules. * * @param 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). * @param format The date-time components to include. See `DatePipe` for details. * @param locale A locale code for the locale format rules to use. * @param 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 {@link DatePipe} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function formatDate(value: string | number | Date, format: string, locale: string, timezone?: string): string; /** * @ngModule CommonModule * @description * * Formats a number as text, with group sizing, separator, and other * parameters based on the locale. * * @param value The number to format. * @param locale A locale code for the locale format rules to use. * @param 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 [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function formatNumber(value: number, locale: string, digitsInfo?: string): string; /** * @ngModule CommonModule * @description * * Formats a number as a percentage according to locale rules. * * @param value The number to format. * @param locale A locale code for the locale format rules to use. * @param 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 {@link formatNumber} * @see {@link DecimalPipe} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * @publicApi * */ export declare function formatPercent(value: number, locale: string, digitsInfo?: string): string; /** * String widths available for date-time formats. * The specific character widths are locale-specific. * Examples are given for `en-US`. * * @see {@link getLocaleDateFormat} * @see {@link getLocaleTimeFormat} * @see {@link getLocaleDateTimeFormat} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * @publicApi */ export declare enum FormatWidth { /** * For `en-US`, 'M/d/yy, h:mm a'` * (Example: `6/15/15, 9:03 AM`) */ Short = 0, /** * For `en-US`, `'MMM d, y, h:mm:ss a'` * (Example: `Jun 15, 2015, 9:03:01 AM`) */ Medium = 1, /** * For `en-US`, `'MMMM d, y, h:mm:ss a z'` * (Example: `June 15, 2015 at 9:03:01 AM GMT+1`) */ Long = 2, /** * 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`) */ Full = 3 } /** * 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 [CLDR website](http://cldr.unicode.org/translation/date-time-1/date-time#TOC-Standalone-vs.-Format-Styles) * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare enum FormStyle { Format = 0, Standalone = 1 } /** * 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$`. * * @param code The currency code. * @param format The format, `wide` or `narrow`. * @param locale A locale code for the locale format rules to use. * * @returns The symbol, or the currency code if no symbol is available. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getCurrencySymbol(code: string, format: 'wide' | 'narrow', locale?: string): string; /** * Retrieves the default currency code for the given locale. * * The default is defined as the first currency which is still in use. * * @param locale The code of the locale whose currency code we want. * @returns The code of the default currency for the given locale. * * @publicApi */ export declare function getLocaleCurrencyCode(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`. * @param 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 [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleCurrencyName(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`. * * @param 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 [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleCurrencySymbol(locale: string): string | null; /** * Retrieves a localized date-value formatting string. * * @param locale A locale code for the locale format rules to use. * @param width The format type. * @returns The localized formatting string. * @see {@link FormatWidth} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleDateFormat(locale: string, width: FormatWidth): string; /** * Retrieves a localized date-time formatting string. * * @param locale A locale code for the locale format rules to use. * @param width The format type. * @returns The localized formatting string. * @see {@link FormatWidth} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleDateTimeFormat(locale: string, width: FormatWidth): string; /** * Retrieves days of the week for the given locale, using the Gregorian calendar. * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns An array of localized name strings. * For example,`[Sunday, Monday, ... Saturday]` for `en-US`. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleDayNames(locale: string, formStyle: FormStyle, width: TranslationWidth): ReadonlyArray; /** * Retrieves day period strings for the given locale. * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns An array of localized period strings. For example, `[AM, PM]` for `en-US`. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleDayPeriods(locale: string, formStyle: FormStyle, width: TranslationWidth): Readonly<[string, string]>; /** * Retrieves the writing direction of a specified locale * @param locale A locale code for the locale format rules to use. * @publicApi * @returns 'rtl' or 'ltr' * @see [Internationalization (i18n) Guide](/guide/i18n-overview) */ export declare function getLocaleDirection(locale: string): 'ltr' | 'rtl'; /** * Retrieves Gregorian-calendar eras for the given locale. * @param locale A locale code for the locale format rules to use. * @param width The required character width. * @returns An array of localized era strings. * For example, `[AD, BC]` for `en-US`. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleEraNames(locale: string, width: TranslationWidth): Readonly<[string, string]>; /** * 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-common-format-data-locale). * * @param 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 {@link getLocaleExtraDayPeriods} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleExtraDayPeriodRules(locale: string): (Time | [Time, Time])[]; /** * 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-common-format-data-locale). * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns The translated day-period strings. * @see {@link getLocaleExtraDayPeriodRules} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleExtraDayPeriods(locale: string, formStyle: FormStyle, width: TranslationWidth): string[]; /** * Retrieves the first day of the week for the given locale. * * @param 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 [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleFirstDayOfWeek(locale: string): WeekDay; /** * Retrieves the locale ID from the currently loaded locale. * The loaded locale could be, for example, a global one rather than a regional one. * @param locale A locale code, such as `fr-FR`. * @returns The locale code. For example, `fr`. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleId(locale: string): string; /** * Retrieves months of the year for the given locale, using the Gregorian calendar. * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns An array of localized name strings. * For example, `[January, February, ...]` for `en-US`. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleMonthNames(locale: string, formStyle: FormStyle, width: TranslationWidth): ReadonlyArray; /** * 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. | * * @param locale A locale code for the locale format rules to use. * @param type The type of numeric value to be formatted (such as `Decimal` or `Currency`.) * @returns The localized format string. * @see {@link NumberFormatStyle} * @see [CLDR website](http://cldr.unicode.org/translation/number-patterns) * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleNumberFormat(locale: string, type: NumberFormatStyle): string; /** * Retrieves a localized number symbol that can be used to replace placeholders in number formats. * @param locale The locale code. * @param symbol The symbol to localize. * @returns The character for the localized symbol. * @see {@link NumberSymbol} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleNumberSymbol(locale: string, symbol: NumberSymbol): string; /** * @alias core/ɵgetLocalePluralCase * @publicApi */ export declare const getLocalePluralCase: (locale: string) => ((value: number) => Plural); /** * Retrieves a localized time-value formatting string. * * @param locale A locale code for the locale format rules to use. * @param width The format type. * @returns The localized formatting string. * @see {@link FormatWidth} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * @publicApi */ export declare function getLocaleTimeFormat(locale: string, width: FormatWidth): string; /** * Range of week days that are considered the week-end for the given locale. * * @param locale A locale code for the locale format rules to use. * @returns The range of day values, `[startDay, endDay]`. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getLocaleWeekEndRange(locale: string): [WeekDay, WeekDay]; /** * Reports the number of decimal digits for a given currency. * The value depends upon the presence of cents in that particular currency. * * @param code The currency code. * @returns The number of decimal digits, typically 0 or 2. * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare function getNumberOfCurrencyDigits(code: string): number; /** * @description * A {@link LocationStrategy} used to configure the {@link 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`. * * @usageNotes * * ### Example * * {@example common/location/ts/hash_location_component.ts region='LocationComponent'} * * @publicApi */ export declare class HashLocationStrategy extends LocationStrategy implements OnDestroy { private _platformLocation; private _baseHref; private _removeListenerFns; constructor(_platformLocation: PlatformLocation, _baseHref?: string); /** @nodoc */ ngOnDestroy(): void; onPopState(fn: LocationChangeListener): void; getBaseHref(): string; path(includeHash?: boolean): string; prepareExternalUrl(internal: string): string; pushState(state: any, title: string, path: string, queryParams: string): void; replaceState(state: any, title: string, path: string, queryParams: string): void; forward(): void; back(): void; getState(): unknown; historyGo(relativePosition?: number): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } declare namespace i1 { export { NgClass } } declare namespace i10 { export { LowerCasePipe, TitleCasePipe, UpperCasePipe } } declare namespace i11 { export { JsonPipe } } declare namespace i12 { export { SlicePipe } } declare namespace i13 { export { DecimalPipe, PercentPipe, CurrencyPipe } } declare namespace i14 { export { DATE_PIPE_DEFAULT_TIMEZONE, DATE_PIPE_DEFAULT_OPTIONS, DatePipe } } declare namespace i15 { export { I18nPluralPipe } } declare namespace i16 { export { I18nSelectPipe } } declare namespace i17 { export { defaultComparator, KeyValue, KeyValuePipe } } /** * @ngModule CommonModule * @description * * Maps a value to a string that pluralizes the value according to locale rules. * * @usageNotes * * ### Example * * {@example common/pipes/ts/i18n_pipe.ts region='I18nPluralPipeComponent'} * * @publicApi */ export declare class I18nPluralPipe implements PipeTransform { private _localization; constructor(_localization: NgLocalization); /** * @param value the number to be formatted * @param pluralMap an object that mimics the ICU format, see * https://unicode-org.github.io/icu/userguide/format_parse/messages/. * @param locale a `string` defining the locale to use (uses the current {@link LOCALE_ID} by * default). */ transform(value: number | null | undefined, pluralMap: { [count: string]: string; }, locale?: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * 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. * * @usageNotes * * ### Example * * {@example common/pipes/ts/i18n_pipe.ts region='I18nSelectPipeComponent'} * * @publicApi */ export declare class I18nSelectPipe implements PipeTransform { /** * @param value a string to be internationalized. * @param mapping an object that indicates the text that should be displayed * for different values of the provided `value`. */ transform(value: string | null | undefined, mapping: { [key: string]: string; }): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } declare namespace i2 { export { NgComponentOutlet } } declare namespace i3 { export { NgForOfContext, NgForOf, NgForOf as NgFor } } declare namespace i4 { export { NgIf, NgIfContext } } declare namespace i5 { export { NgTemplateOutlet } } declare namespace i6 { export { NgStyle } } declare namespace i7 { export { SwitchView, NgSwitch, NgSwitchCase, NgSwitchDefault } } declare namespace i8 { export { NgPlural, NgPluralCase } } declare namespace i9 { export { AsyncPipe } } /** * Injection token that configures the image optimized image functionality. * * @see {@link NgOptimizedImage} * @publicApi */ export declare const IMAGE_CONFIG: InjectionToken; /** * Injection token that configures the image loader function. * * @see {@link ImageLoader} * @see {@link NgOptimizedImage} * @publicApi */ export declare const IMAGE_LOADER: InjectionToken; /** * A configuration object for the NgOptimizedImage directive. Contains: * - breakpoints: An array of integer breakpoints used to generate * srcsets for responsive images. * * Learn more about the responsive image configuration in [the NgOptimizedImage * guide](guide/image-directive). * @publicApi */ export declare type ImageConfig = { breakpoints?: number[]; }; /** * Represents an image loader function. Image loader functions are used by the * NgOptimizedImage directive to produce full image URL based on the image name and its width. * * @publicApi */ export declare type ImageLoader = (config: ImageLoaderConfig) => string; /** * Config options recognized by the image loader function. * * @see {@link ImageLoader} * @see {@link NgOptimizedImage} * @publicApi */ export declare interface ImageLoaderConfig { /** * Image file name to be added to the image request URL. */ src: string; /** * Width of the requested image (to be used when generating srcset). */ width?: number; /** * Additional user-provided parameters for use by the ImageLoader. */ loaderParams?: { [key: string]: any; }; } /** * Returns whether a platform id represents a browser platform. * @publicApi */ export declare function isPlatformBrowser(platformId: Object): boolean; /** * Returns whether a platform id represents a server platform. * @publicApi */ export declare function isPlatformServer(platformId: Object): boolean; /** * Returns whether a platform id represents a web worker app platform. * @publicApi * @deprecated This function serves no purpose since the removal of the Webworker platform. It will * always return `false`. */ export declare function isPlatformWorkerApp(platformId: Object): boolean; /** * Returns whether a platform id represents a web worker UI platform. * @publicApi * @deprecated This function serves no purpose since the removal of the Webworker platform. It will * always return `false`. */ export declare function isPlatformWorkerUi(platformId: Object): boolean; /** * @ngModule CommonModule * @description * * Converts a value into its JSON-format representation. Useful for debugging. * * @usageNotes * * The following component uses a JSON pipe to convert an object * to JSON format, and displays the string in both formats for comparison. * * {@example common/pipes/ts/json_pipe.ts region='JsonPipe'} * * @publicApi */ export declare class JsonPipe implements PipeTransform { /** * @param value A value of any type to convert into a JSON-format string. */ transform(value: any): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * A key value pair. * Usually used to represent the key value pairs from a Map or Object. * * @publicApi */ export declare interface KeyValue { key: K; value: V; } /** * @ngModule CommonModule * @description * * 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. * * @usageNotes * ### Examples * * This examples show how an Object or a Map can be iterated by ngFor with the use of this * keyvalue pipe. * * {@example common/pipes/ts/keyvalue_pipe.ts region='KeyValuePipe'} * * @publicApi */ export declare class KeyValuePipe implements PipeTransform { private readonly differs; constructor(differs: KeyValueDiffers); private differ; private keyValues; private compareFn; transform(input: ReadonlyMap, compareFn?: (a: KeyValue, b: KeyValue) => number): Array>; transform(input: Record, compareFn?: (a: KeyValue, b: KeyValue) => number): Array>; transform(input: Record | ReadonlyMap, compareFn?: (a: KeyValue, b: KeyValue) => number): Array>; transform(input: null | undefined, compareFn?: (a: KeyValue, b: KeyValue) => number): null; transform(input: ReadonlyMap | null | undefined, compareFn?: (a: KeyValue, b: KeyValue) => number): Array> | null; transform(input: Record | null | undefined, compareFn?: (a: KeyValue, b: KeyValue) => number): Array> | null; transform(input: Record | ReadonlyMap | null | undefined, compareFn?: (a: KeyValue, b: KeyValue) => number): Array> | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @description * * 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. * * @usageNotes * * 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 * * * * @publicApi */ declare class Location_2 implements OnDestroy { constructor(locationStrategy: LocationStrategy); /** @nodoc */ ngOnDestroy(): void; /** * Normalizes the URL path for this location. * * @param includeHash True to include an anchor fragment in the path. * * @returns The normalized URL path. */ path(includeHash?: boolean): string; /** * Reports the current state of the location history. * @returns The current value of the `history.state` object. */ getState(): unknown; /** * Normalizes the given path and compares to the current normalized path. * * @param path The given URL path. * @param query Query parameters. * * @returns True if the given URL path is equal to the current normalized path, false * otherwise. */ isCurrentPathEqualTo(path: string, query?: string): boolean; /** * Normalizes a URL path by stripping any trailing slashes. * * @param url String representing a URL. * * @returns The normalized URL string. */ normalize(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. * * @param url String representing a URL. * * @returns A normalized platform-specific URL. */ prepareExternalUrl(url: string): string; /** * Changes the browser's URL to a normalized version of a given URL, and pushes a * new item onto the platform's history. * * @param path URL path to normalize. * @param query Query parameters. * @param state Location history state. * */ go(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. * * @param path URL path to normalize. * @param query Query parameters. * @param state Location history state. */ replaceState(path: string, query?: string, state?: any): void; /** * Navigates forward in the platform's history. */ forward(): void; /** * Navigates back in the platform's history. */ back(): void; /** * Navigate to a specific page from session history, identified by its relative position to the * current page. * * @param 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 https://developer.mozilla.org/en-US/docs/Web/API/History_API#Moving_to_a_specific_point_in_history */ historyGo(relativePosition?: number): void; /** * Registers a URL change listener. Use to catch updates performed by the Angular * framework that are not detectible through "popstate" or "hashchange" events. * * @param fn The change handler function, which take a URL and a location history state. * @returns A function that, when executed, unregisters a URL change listener. */ onUrlChange(fn: (url: string, state: unknown) => void): VoidFunction; /** * 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. * * @param value Event that is triggered when the state history changes. * @param exception The exception to throw. * * @see [onpopstate](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate) * * @returns Subscribed events. */ subscribe(onNext: (value: PopStateEvent_2) => void, onThrow?: ((exception: any) => void) | null, onReturn?: (() => void) | null): SubscriptionLike; /** * Normalizes URL parameters by prepending with `?` if needed. * * @param params String of URL parameters. * * @returns The normalized URL parameters string. */ static normalizeQueryParams: (params: string) => string; /** * Joins two parts of a URL with a slash if needed. * * @param start URL string * @param end URL string * * * @returns The joined URL string. */ static joinWithSlash: (start: string, end: 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. * * @param url URL string. * * @returns The URL string, modified if needed. */ static stripTrailingSlash: (url: string) => string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } export { Location_2 as Location } /** * @description * Indicates when a location is initialized. * * @publicApi */ export declare const LOCATION_INITIALIZED: InjectionToken>; /** * @description * A serializable version of the event from `onPopState` or `onHashChange` * * @publicApi */ export declare interface LocationChangeEvent { type: string; state: any; } /** * @publicApi */ export declare interface LocationChangeListener { (event: LocationChangeEvent): any; } /** * 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. * * @publicApi */ export declare abstract class LocationStrategy { abstract path(includeHash?: boolean): string; abstract prepareExternalUrl(internal: string): string; abstract getState(): unknown; abstract pushState(state: any, title: string, url: string, queryParams: string): void; abstract replaceState(state: any, title: string, url: string, queryParams: string): void; abstract forward(): void; abstract back(): void; historyGo?(relativePosition: number): void; abstract onPopState(fn: LocationChangeListener): void; abstract getBaseHref(): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * Transforms text to all lower case. * * @see {@link UpperCasePipe} * @see {@link TitleCasePipe} * @usageNotes * * 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. * * * * @ngModule CommonModule * @publicApi */ export declare class LowerCasePipe implements PipeTransform { /** * @param value The string to transform to lower case. */ transform(value: string): string; transform(value: null | undefined): null; transform(value: string | null | undefined): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * * @usageNotes * ``` * ... * * ... * * ... * * ... * * ... * ``` * * @description * * 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. * * @publicApi */ export declare class NgClass implements DoCheck { private _iterableDiffers; private _keyValueDiffers; private _ngEl; private _renderer; private initialClasses; private rawClass; private stateMap; constructor(_iterableDiffers: IterableDiffers, _keyValueDiffers: KeyValueDiffers, _ngEl: ElementRef, _renderer: Renderer2); set klass(value: string); set ngClass(value: string | string[] | Set | { [klass: string]: any; } | null | undefined); ngDoCheck(): void; private _updateState; private _applyStateDiff; private _toggleClass; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Instantiates a {@link Component} type and inserts its Host View into the 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 be destroyed. * * @usageNotes * * ### Fine tune control * * You can control the component creation process by using the following optional attributes: * * * `ngComponentOutletInputs`: Optional component inputs object, which will be bind to the * component. * * * `ngComponentOutletInjector`: Optional custom {@link 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 it exists. * * * `ngComponentOutletNgModule`: Optional NgModule class reference to allow loading another * module dynamically, then loading a component from that module. * * * `ngComponentOutletNgModuleFactory`: Deprecated config option that allows providing optional * NgModule factory to allow loading another module dynamically, then loading a component from that * module. Use `ngComponentOutletNgModule` instead. * * ### Syntax * * Simple * ``` * * ``` * * With inputs * ``` * * * ``` * * Customized injector/content * ``` * * * ``` * * Customized NgModule reference * ``` * * * ``` * * ### A simple example * * {@example common/ngComponentOutlet/ts/module.ts region='SimpleExample'} * * A more complete example with additional options: * * {@example common/ngComponentOutlet/ts/module.ts region='CompleteExample'} * * @publicApi * @ngModule CommonModule */ export declare class NgComponentOutlet implements OnChanges, DoCheck, OnDestroy { private _viewContainerRef; ngComponentOutlet: Type | null; ngComponentOutletInputs?: Record; ngComponentOutletInjector?: Injector; ngComponentOutletContent?: any[][]; ngComponentOutletNgModule?: Type; /** * @deprecated This input is deprecated, use `ngComponentOutletNgModule` instead. */ ngComponentOutletNgModuleFactory?: NgModuleFactory; private _componentRef; private _moduleRef; /** * A helper data structure that allows us to track inputs that were part of the * ngComponentOutletInputs expression. Tracking inputs is necessary for proper removal of ones * that are no longer referenced. */ private _inputsUsed; constructor(_viewContainerRef: ViewContainerRef); private _needToReCreateNgModuleInstance; private _needToReCreateComponentInstance; /** @nodoc */ ngOnChanges(changes: SimpleChanges): void; /** @nodoc */ ngDoCheck(): void; /** @nodoc */ ngOnDestroy(): void; private _applyInputStateDiff; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * 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 `
  • ` element. * * ``` *
  • ...
    • * ``` * * The shorthand form expands into a long form that uses the `ngForOf` selector * on an `` element. * The content of the `` element is the `
  • ` element that held the * short-form directive. * * Here is the expanded version of the short-form example. * * ``` * *
  • ...
    • *     * ``` * * 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/structural-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 further discussion, see * [Structural Directives](guide/structural-directives#one-per-element). * * @usageNotes * * ### Local variables * * `NgForOf` provides exported values that can be aliased to local variables. * For example: * * ``` *
  • * {{i}}/{{users.length}}. {{user}} 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`: 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 `` 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 [Structural Directives](guide/structural-directives) * @ngModule CommonModule * @publicApi */ declare class NgForOf = NgIterable> implements DoCheck { private _viewContainer; private _template; private _differs; /** * The value of the iterable expression, which can be used as a * [template input variable](guide/structural-directives#shorthand). */ set ngForOf(ngForOf: U & NgIterable | undefined | null); /** * Specifies a custom `TrackByFunction` to compute the identity of items in an iterable. * * If a custom `TrackByFunction` is not provided, `NgForOf` will use the item's [object * identity](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) * as the key. * * `NgForOf` uses the computed key to associate items in an iterable with DOM elements * it produces for these items. * * A custom `TrackByFunction` is useful to provide good user experience in cases when items in an * iterable rendered using `NgForOf` have a natural identifier (for example, custom ID or a * primary key), and this iterable could be updated with new object instances that still * represent the same underlying entity (for example, when data is re-fetched from the server, * and the iterable is recreated and re-rendered, but most of the data is still the same). * * @see {@link TrackByFunction} */ set ngForTrackBy(fn: TrackByFunction); get ngForTrackBy(): TrackByFunction; private _ngForOf; private _ngForOfDirty; private _differ; private _trackByFn; constructor(_viewContainer: ViewContainerRef, _template: TemplateRef>, _differs: IterableDiffers); /** * A reference to the template that is stamped out for each item in the iterable. * @see [template reference variable](guide/template-reference-variables) */ set ngForTemplate(value: TemplateRef>); /** * Applies the changes when needed. * @nodoc */ ngDoCheck(): void; private _applyChanges; /** * 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. */ static ngTemplateContextGuard>(dir: NgForOf, ctx: any): ctx is NgForOfContext; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngFor][ngForOf]", never, { "ngForOf": { "alias": "ngForOf"; "required": false; }; "ngForTrackBy": { "alias": "ngForTrackBy"; "required": false; }; "ngForTemplate": { "alias": "ngForTemplate"; "required": false; }; }, {}, never, never, true, never>; } export { NgForOf as NgFor } export { NgForOf } /** * @publicApi */ export declare class NgForOfContext = NgIterable> { $implicit: T; ngForOf: U; index: number; count: number; constructor($implicit: T, ngForOf: U, index: number, count: number); get first(): boolean; get last(): boolean; get even(): boolean; get odd(): boolean; } /** * 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 `` element. * * Simple form with shorthand syntax: * * ``` *
    Content to render when condition is true.
    * ``` * * Simple form with expanded syntax: * * ``` *
    Content to render when condition is * true.
     * ``` * * Form with an "else" block: * * ``` *
    Content to render when condition is true.
    * Content to render when condition is false. * ``` * * Shorthand form with "then" and "else" blocks: * * ``` *
    * Content to render when condition is true. * Content to render when condition is false. * ``` * * Form with storing the value locally: * * ``` *
    {{value}}
    * Content to render when value is null. * ``` * * @usageNotes * * 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. * * {@example common/ngIf/ts/module.ts region='NgIfSimple'} * * ### 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 `` element labeled `#elseBlock`. * The template can be defined anywhere in the component view, but is typically placed right after * `ngIf` for readability. * * {@example common/ngIf/ts/module.ts region='NgIfElse'} * * ### 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 `` element. When you do this, you can * change which template to use at runtime, as shown in the following example. * * {@example common/ngIf/ts/module.ts region='NgIfThenElse'} * * ### 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. * * {@example common/ngIf/ts/module.ts region='NgIfAs'} * * 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. * * ``` *
    * ... *
    * * *
    Loading...
    *     * ``` * * You can see that the "else" clause references the `` * 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 `` tag, with `ngIf` and `ngIfElse` directives. * The anchor element containing the template for the "then" clause becomes * the content of this unlabeled `` tag. * * ``` * *
    * ... *
    *     * * *
    Loading...
    *     * ``` * * The presence of the implicit template object has implications for the nesting of * structural directives. For more on this subject, see * [Structural Directives](guide/structural-directives#one-per-element). * * @ngModule CommonModule * @publicApi */ export declare class NgIf { private _viewContainer; private _context; private _thenTemplateRef; private _elseTemplateRef; private _thenViewRef; private _elseViewRef; constructor(_viewContainer: ViewContainerRef, templateRef: TemplateRef>); /** * The Boolean expression to evaluate as the condition for showing a template. */ set ngIf(condition: T); /** * A template to show if the condition expression evaluates to true. */ set ngIfThen(templateRef: TemplateRef> | null); /** * A template to show if the condition expression evaluates to false. */ set ngIfElse(templateRef: TemplateRef> | null); private _updateView; /** * 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`. */ static ngTemplateGuard_ngIf: 'binding'; /** * 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. */ static ngTemplateContextGuard(dir: NgIf, ctx: any): ctx is NgIfContext>; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngIf]", never, { "ngIf": { "alias": "ngIf"; "required": false; }; "ngIfThen": { "alias": "ngIfThen"; "required": false; }; "ngIfElse": { "alias": "ngIfElse"; "required": false; }; }, {}, never, never, true, never>; } /** * @publicApi */ export declare class NgIfContext { $implicit: T; ngIf: T; } /** * Returns the plural case based on the locale * * @publicApi */ export declare class NgLocaleLocalization extends NgLocalization { protected locale: string; constructor(locale: string); getPluralCategory(value: any, locale?: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * @publicApi */ export declare abstract class NgLocalization { abstract getPluralCategory(value: any, locale?: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * Directive that improves image loading performance by enforcing best practices. * * `NgOptimizedImage` ensures that the loading of the Largest Contentful Paint (LCP) image is * prioritized by: * - Automatically setting the `fetchpriority` attribute on the `` tag * - Lazy loading non-priority images by default * - Asserting that there is a corresponding preconnect link tag in the document head * * In addition, the directive: * - Generates appropriate asset URLs if a corresponding `ImageLoader` function is provided * - Automatically generates a srcset * - Requires that `width` and `height` are set * - Warns if `width` or `height` have been set incorrectly * - Warns if the image will be visually distorted when rendered * * @usageNotes * The `NgOptimizedImage` directive is marked as [standalone](guide/standalone-components) and can * be imported directly. * * Follow the steps below to enable and use the directive: * 1. Import it into the necessary NgModule or a standalone Component. * 2. Optionally provide an `ImageLoader` if you use an image hosting service. * 3. Update the necessary `` tags in templates and replace `src` attributes with `ngSrc`. * Using a `ngSrc` allows the directive to control when the `src` gets set, which triggers an image * download. * * Step 1: import the `NgOptimizedImage` directive. * * ```typescript * import { NgOptimizedImage } from '@angular/common'; * * // Include it into the necessary NgModule * @NgModule({ * imports: [NgOptimizedImage], * }) * class AppModule {} * * // ... or a standalone Component * @Component({ * standalone: true * imports: [NgOptimizedImage], * }) * class MyStandaloneComponent {} * ``` * * Step 2: configure a loader. * * To use the **default loader**: no additional code changes are necessary. The URL returned by the * generic loader will always match the value of "src". In other words, this loader applies no * transformations to the resource URL and the value of the `ngSrc` attribute will be used as is. * * To use an existing loader for a **third-party image service**: add the provider factory for your * chosen service to the `providers` array. In the example below, the Imgix loader is used: * * ```typescript * import {provideImgixLoader} from '@angular/common'; * * // Call the function and add the result to the `providers` array: * providers: [ * provideImgixLoader("https://my.base.url/"), * ], * ``` * * The `NgOptimizedImage` directive provides the following functions: * - `provideCloudflareLoader` * - `provideCloudinaryLoader` * - `provideImageKitLoader` * - `provideImgixLoader` * * If you use a different image provider, you can create a custom loader function as described * below. * * To use a **custom loader**: provide your loader function as a value for the `IMAGE_LOADER` DI * token. * * ```typescript * import {IMAGE_LOADER, ImageLoaderConfig} from '@angular/common'; * * // Configure the loader using the `IMAGE_LOADER` token. * providers: [ * { * provide: IMAGE_LOADER, * useValue: (config: ImageLoaderConfig) => { * return `https://example.com/${config.src}-${config.width}.jpg}`; * } * }, * ], * ``` * * Step 3: update `` tags in templates to use `ngSrc` instead of `src`. * * ``` * * ``` * * @publicApi */ export declare class NgOptimizedImage implements OnInit, OnChanges, OnDestroy { private imageLoader; private config; private renderer; private imgElement; private injector; private readonly isServer; private readonly preloadLinkCreator; private lcpObserver; /** * Calculate the rewritten `src` once and store it. * This is needed to avoid repetitive calculations and make sure the directive cleanup in the * `ngOnDestroy` does not rely on the `IMAGE_LOADER` logic (which in turn can rely on some other * instance that might be already destroyed). */ private _renderedSrc; /** * Name of the source image. * Image name will be processed by the image loader and the final URL will be applied as the `src` * property of the image. */ ngSrc: string; /** * A comma separated list of width or density descriptors. * The image name will be taken from `ngSrc` and combined with the list of width or density * descriptors to generate the final `srcset` property of the image. * * Example: * ``` * => * * ``` */ ngSrcset: string; /** * The base `sizes` attribute passed through to the `` element. * Providing sizes causes the image to create an automatic responsive srcset. */ sizes?: string; /** * For responsive images: the intrinsic width of the image in pixels. * For fixed size images: the desired rendered width of the image in pixels. */ width: number | undefined; /** * For responsive images: the intrinsic height of the image in pixels. * For fixed size images: the desired rendered height of the image in pixels.* The intrinsic * height of the image in pixels. */ height: number | undefined; /** * The desired loading behavior (lazy, eager, or auto). Defaults to `lazy`, * which is recommended for most images. * * Warning: Setting images as loading="eager" or loading="auto" marks them * as non-priority images and can hurt loading performance. For images which * may be the LCP element, use the `priority` attribute instead of `loading`. */ loading?: 'lazy' | 'eager' | 'auto'; /** * Indicates whether this image should have a high priority. */ priority: boolean; /** * Data to pass through to custom loaders. */ loaderParams?: { [key: string]: any; }; /** * Disables automatic srcset generation for this image. */ disableOptimizedSrcset: boolean; /** * Sets the image to "fill mode", which eliminates the height/width requirement and adds * styles such that the image fills its containing element. */ fill: boolean; /** @nodoc */ ngOnInit(): void; private setHostAttributes; /** @nodoc */ ngOnChanges(changes: SimpleChanges): void; private callImageLoader; private getLoadingBehavior; private getFetchPriority; private getRewrittenSrc; private getRewrittenSrcset; private getAutomaticSrcset; private getResponsiveSrcset; private updateSrcAndSrcset; private getFixedSrcset; private shouldGenerateAutomaticSrcset; /** @nodoc */ ngOnDestroy(): void; private setHostAttribute; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; static ngAcceptInputType_ngSrc: string | i0.ɵSafeValue; static ngAcceptInputType_width: unknown; static ngAcceptInputType_height: unknown; static ngAcceptInputType_priority: unknown; static ngAcceptInputType_disableOptimizedSrcset: unknown; static ngAcceptInputType_fill: unknown; } /** * @ngModule CommonModule * * @usageNotes * ``` * * there is nothing * there is one * there are a few * * ``` * * @description * * 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 * * @publicApi */ export declare class NgPlural { private _localization; private _activeView?; private _caseViews; constructor(_localization: NgLocalization); set ngPlural(value: number); addCase(value: string, switchView: SwitchView): void; private _updateView; private _clearViews; private _activateView; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * * Creates a view that will be added/removed from the parent {@link NgPlural} when the * given expression matches the plural expression according to CLDR rules. * * @usageNotes * ``` * * ... * ... * *``` * * See {@link NgPlural} for more details and example. * * @publicApi */ export declare class NgPluralCase { value: string; constructor(value: string, template: TemplateRef, viewContainer: ViewContainerRef, ngPlural: NgPlural); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @usageNotes * * Set the font of the containing element to the result of an expression. * * ``` * ... * ``` * * Set the width of the containing element to a pixel value returned by an expression. * * ``` * ... * ``` * * Set a collection of style values using an expression that returns key-value pairs. * * ``` * ... * ``` * * @description * * 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 `.` 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. * * @publicApi */ export declare class NgStyle implements DoCheck { private _ngEl; private _differs; private _renderer; private _ngStyle; private _differ; constructor(_ngEl: ElementRef, _differs: KeyValueDiffers, _renderer: Renderer2); set ngStyle(values: { [klass: string]: any; } | null | undefined); ngDoCheck(): void; private _setStyle; private _applyChanges; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * 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. * * @usageNotes * Define a container element for the directive, and specify the switch expression * to match against as an attribute: * * ``` * * ``` * * Within the container, `*ngSwitchCase` statements specify the match expressions * as attributes. Include `*ngSwitchDefault` as the final case. * * ``` * * ... * ... * ... * * ``` * * ### Usage Examples * * The following example shows how to use more than one case to display the same view: * * ``` * * * ... * ... * ... * * ... * * ``` * * The following example shows how cases can be nested: * ``` * * ... * ... * ... * * * * * * ... * * ``` * * @publicApi * @see {@link NgSwitchCase} * @see {@link NgSwitchDefault} * @see [Structural Directives](guide/structural-directives) * */ export declare class NgSwitch { private _defaultViews; private _defaultUsed; private _caseCount; private _lastCaseCheckIndex; private _lastCasesMatched; private _ngSwitch; set ngSwitch(newValue: any); private _updateDefaultCases; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * 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. * * @usageNotes * * Within a switch container, `*ngSwitchCase` statements specify the match expressions * as attributes. Include `*ngSwitchDefault` as the final case. * * ``` * * ... * ... * ... * * ``` * * 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. * * @publicApi * @see {@link NgSwitch} * @see {@link NgSwitchDefault} * */ export declare class NgSwitchCase implements DoCheck { private ngSwitch; private _view; /** * Stores the HTML template to be selected on match. */ ngSwitchCase: any; constructor(viewContainer: ViewContainerRef, templateRef: TemplateRef, ngSwitch: NgSwitch); /** * Performs case matching. For internal use only. * @nodoc */ ngDoCheck(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * * Creates a view that is rendered when no `NgSwitchCase` expressions * match the `NgSwitch` expression. * This statement should be the final case in an `NgSwitch`. * * @publicApi * @see {@link NgSwitch} * @see {@link NgSwitchCase} * */ export declare class NgSwitchDefault { constructor(viewContainer: ViewContainerRef, templateRef: TemplateRef, ngSwitch: NgSwitch); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * * 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. * * @usageNotes * ``` * * ``` * * Using the key `$implicit` in the context object will set its value as default. * * ### Example * * {@example common/ngTemplateOutlet/ts/module.ts region='NgTemplateOutlet'} * * @publicApi */ export declare class NgTemplateOutlet implements OnChanges { private _viewContainerRef; private _viewRef; /** * A context object to attach to the {@link 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. */ ngTemplateOutletContext: C | null; /** * A string defining the template reference and optionally the context object for the template. */ ngTemplateOutlet: TemplateRef | null; /** Injector to be used within the embedded view. */ ngTemplateOutletInjector: Injector | null; constructor(_viewContainerRef: ViewContainerRef); /** @nodoc */ ngOnChanges(changes: SimpleChanges): void; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngTemplateOutlet]", never, { "ngTemplateOutletContext": { "alias": "ngTemplateOutletContext"; "required": false; }; "ngTemplateOutlet": { "alias": "ngTemplateOutlet"; "required": false; }; "ngTemplateOutletInjector": { "alias": "ngTemplateOutletInjector"; "required": false; }; }, {}, never, never, true, never>; } /** * Format styles that can be used to represent numbers. * @see {@link getLocaleNumberFormat} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare enum NumberFormatStyle { Decimal = 0, Percent = 1, Currency = 2, Scientific = 3 } /** * Symbols that can be used to replace placeholders in number patterns. * Examples are based on `en-US` values. * * @see {@link getLocaleNumberSymbol} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare enum NumberSymbol { /** * Decimal separator. * For `en-US`, the dot character. * Example: 2,345`.`67 */ Decimal = 0, /** * Grouping separator, typically for thousands. * For `en-US`, the comma character. * Example: 2`,`345.67 */ Group = 1, /** * List-item separator. * Example: "one, two, and three" */ List = 2, /** * Sign for percentage (out of 100). * Example: 23.4% */ PercentSign = 3, /** * Sign for positive numbers. * Example: +23 */ PlusSign = 4, /** * Sign for negative numbers. * Example: -23 */ MinusSign = 5, /** * Computer notation for exponential value (n times a power of 10). * Example: 1.2E3 */ Exponential = 6, /** * Human-readable format of exponential. * Example: 1.2x103 */ SuperscriptingExponent = 7, /** * Sign for permille (out of 1000). * Example: 23.4‰ */ PerMille = 8, /** * Infinity, can be used with plus and minus. * Example: ∞, +∞, -∞ */ Infinity = 9, /** * Not a number. * Example: NaN */ NaN = 10, /** * Symbol used between time units. * Example: 10:52 */ TimeSeparator = 11, /** * Decimal separator for currency values (fallback to `Decimal`). * Example: $2,345.67 */ CurrencyDecimal = 12, /** * Group separator for currency values (fallback to `Group`). * Example: $2,345.67 */ CurrencyGroup = 13 } /** * @description * A {@link LocationStrategy} used to configure the {@link 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 may provide a {@link APP_BASE_HREF} * or add a `` element to the document to override the default. * * 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 `` and/or `APP_BASE_HREF` should end with a `/`. * * Similarly, if you add `` 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 `` will be preserved, as outlined * by the [RFC](https://tools.ietf.org/html/rfc3986#section-5.2.2). * * @usageNotes * * ### Example * * {@example common/location/ts/path_location_component.ts region='LocationComponent'} * * @publicApi */ export declare class PathLocationStrategy extends LocationStrategy implements OnDestroy { private _platformLocation; private _baseHref; private _removeListenerFns; constructor(_platformLocation: PlatformLocation, href?: string); /** @nodoc */ ngOnDestroy(): void; onPopState(fn: LocationChangeListener): void; getBaseHref(): string; prepareExternalUrl(internal: string): string; path(includeHash?: boolean): string; pushState(state: any, title: string, url: string, queryParams: string): void; replaceState(state: any, title: string, url: string, queryParams: string): void; forward(): void; back(): void; getState(): unknown; historyGo(relativePosition?: number): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * @ngModule CommonModule * @description * * 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 {@link formatPercent} * * @usageNotes * 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`. * * * * @publicApi */ export declare class PercentPipe implements PipeTransform { private _locale; constructor(_locale: string); transform(value: number | string, digitsInfo?: string, locale?: string): string | null; transform(value: null | undefined, digitsInfo?: string, locale?: string): null; transform(value: number | string | null | undefined, digitsInfo?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * This class should not be used directly by an application developer. Instead, use * {@link 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 {@link LocationStrategy} * when they need to interact with the DOM APIs like pushState, popState, etc. * * {@link LocationStrategy} in turn is used by the {@link Location} service which is used directly * by the {@link Router} in order to navigate between routes. Since all interactions between {@link * Router} / * {@link Location} / {@link LocationStrategy} and DOM APIs flow through the `PlatformLocation` * class, they are all platform-agnostic. * * @publicApi */ export declare abstract class PlatformLocation { abstract getBaseHrefFromDOM(): string; abstract getState(): unknown; /** * Returns a function that, when executed, removes the `popstate` event handler. */ abstract onPopState(fn: LocationChangeListener): VoidFunction; /** * Returns a function that, when executed, removes the `hashchange` event handler. */ abstract onHashChange(fn: LocationChangeListener): VoidFunction; abstract get href(): string; abstract get protocol(): string; abstract get hostname(): string; abstract get port(): string; abstract get pathname(): string; abstract get search(): string; abstract get hash(): string; abstract replaceState(state: any, title: string, url: string): void; abstract pushState(state: any, title: string, url: string): void; abstract forward(): void; abstract back(): void; historyGo?(relativePosition: number): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * Plurality cases used for translating plurals to different languages. * * @see {@link NgPlural} * @see {@link NgPluralCase} * @see [Internationalization (i18n) Guide](/guide/i18n-overview) * * @publicApi */ export declare enum Plural { Zero = 0, One = 1, Two = 2, Few = 3, Many = 4, Other = 5 } /** @publicApi */ declare interface PopStateEvent_2 { pop?: boolean; state?: any; type?: string; url?: string; } export { PopStateEvent_2 as PopStateEvent } /** * Injection token to configure which origins should be excluded * from the preconnect checks. It can either be a single string or an array of strings * to represent a group of origins, for example: * * ```typescript * {provide: PRECONNECT_CHECK_BLOCKLIST, useValue: 'https://your-domain.com'} * ``` * * or: * * ```typescript * {provide: PRECONNECT_CHECK_BLOCKLIST, * useValue: ['https://your-domain-1.com', 'https://your-domain-2.com']} * ``` * * @publicApi */ export declare const PRECONNECT_CHECK_BLOCKLIST: InjectionToken<(string | string[])[]>; /** * Function that generates an ImageLoader for [Cloudflare Image * Resizing](https://developers.cloudflare.com/images/image-resizing/) and turns it into an Angular * provider. Note: Cloudflare has multiple image products - this provider is specifically for * Cloudflare Image Resizing; it will not work with Cloudflare Images or Cloudflare Polish. * * @param path Your domain name, e.g. https://mysite.com * @returns Provider that provides an ImageLoader function * * @publicApi */ export declare const provideCloudflareLoader: (path: string) => Provider[]; /** * Function that generates an ImageLoader for Cloudinary and turns it into an Angular provider. * * @param path Base URL of your Cloudinary images * This URL should match one of the following formats: * https://res.cloudinary.com/mysite * https://mysite.cloudinary.com * https://subdomain.mysite.com * @returns Set of providers to configure the Cloudinary loader. * * @publicApi */ export declare const provideCloudinaryLoader: (path: string) => Provider[]; /** * Function that generates an ImageLoader for ImageKit and turns it into an Angular provider. * * @param path Base URL of your ImageKit images * This URL should match one of the following formats: * https://ik.imagekit.io/myaccount * https://subdomain.mysite.com * @returns Set of providers to configure the ImageKit loader. * * @publicApi */ export declare const provideImageKitLoader: (path: string) => Provider[]; /** * Function that generates an ImageLoader for Imgix and turns it into an Angular provider. * * @param path path to the desired Imgix origin, * e.g. https://somepath.imgix.net or https://images.mysite.com * @returns Set of providers to configure the Imgix loader. * * @publicApi */ export declare const provideImgixLoader: (path: string) => Provider[]; /** * Register global data to be used internally by Angular. See the * ["I18n guide"](guide/i18n-common-format-data-locale) to know how to import additional locale * data. * * The signature registerLocaleData(data: any, extraData?: any) is deprecated since v5.1 * * @publicApi */ export declare function registerLocaleData(data: any, localeId?: string | any, extraData?: any): void; /** * @ngModule CommonModule * @description * * Creates a new `Array` or `String` containing a subset (slice) of the elements. * * @usageNotes * * 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: * * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_list'} * * produces the following: * * ```html *
  • b
    • *
  • c
    • * ``` * * ### String Examples * * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_string'} * * @publicApi */ export declare class SlicePipe implements PipeTransform { /** * @param value a list or a string to be sliced. * @param 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. * @param 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. */ transform(value: ReadonlyArray, start: number, end?: number): Array; transform(value: null | undefined, start: number, end?: number): null; transform(value: ReadonlyArray | null | undefined, start: number, end?: number): Array | null; transform(value: string, start: number, end?: number): string; transform(value: string | null | undefined, start: number, end?: number): string | null; private supports; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } declare class SwitchView { private _viewContainerRef; private _templateRef; private _created; constructor(_viewContainerRef: ViewContainerRef, _templateRef: TemplateRef); create(): void; destroy(): void; enforceState(created: boolean): void; } /** * Represents a time value with hours and minutes. * * @publicApi */ export declare type Time = { hours: number; minutes: number; }; /** * 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 {@link LowerCasePipe} * @see {@link UpperCasePipe} * * @usageNotes * The following example shows the result of transforming various strings into title case. * * * * @ngModule CommonModule * @publicApi */ export declare class TitleCasePipe implements PipeTransform { /** * @param value The string to transform to title case. */ transform(value: string): string; transform(value: null | undefined): null; transform(value: string | null | undefined): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * String widths available for translations. * The specific character widths are locale-specific. * Examples are given for the word "Sunday" in English. * * @publicApi */ export declare enum TranslationWidth { /** 1 character for `en-US`. For example: 'S' */ Narrow = 0, /** 3 characters for `en-US`. For example: 'Sun' */ Abbreviated = 1, /** Full length for `en-US`. For example: "Sunday" */ Wide = 2, /** 2 characters for `en-US`, For example: "Su" */ Short = 3 } /** * Transforms text to all upper case. * @see {@link LowerCasePipe} * @see {@link TitleCasePipe} * * @ngModule CommonModule * @publicApi */ export declare class UpperCasePipe implements PipeTransform { /** * @param value The string to transform to upper case. */ transform(value: string): string; transform(value: null | undefined): null; transform(value: string | null | undefined): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @publicApi */ export declare const VERSION: Version; /** * Defines a scroll position manager. Implemented by `BrowserViewportScroller`. * * @publicApi */ export declare abstract class ViewportScroller { /** @nocollapse */ static ɵprov: unknown; /** * Configures the top offset used when scrolling to an anchor. * @param offset A position in screen coordinates (a tuple with x and y values) * or a function that returns the top offset position. * */ abstract setOffset(offset: [number, number] | (() => [number, number])): void; /** * Retrieves the current scroll position. * @returns A position in screen coordinates (a tuple with x and y values). */ abstract getScrollPosition(): [number, number]; /** * Scrolls to a specified position. * @param position A position in screen coordinates (a tuple with x and y values). */ abstract scrollToPosition(position: [number, number]): void; /** * Scrolls to an anchor element. * @param anchor The ID of the anchor element. */ abstract scrollToAnchor(anchor: string): 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). */ abstract setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void; } /** * The value for each day of the week, based on the `en-US` locale * * @publicApi */ export declare enum WeekDay { Sunday = 0, Monday = 1, Tuesday = 2, Wednesday = 3, Thursday = 4, Friday = 5, Saturday = 6 } /** * A wrapper around the `XMLHttpRequest` constructor. * * @publicApi */ export declare abstract class XhrFactory { abstract build(): XMLHttpRequest; } /** * Provides DOM operations in an environment-agnostic way. * * @security Tread carefully! Interacting with the DOM directly is dangerous and * can introduce XSS risks. */ export declare abstract class ɵDomAdapter { abstract dispatchEvent(el: any, evt: any): any; abstract readonly supportsDOMEvents: boolean; abstract remove(el: any): void; abstract createElement(tagName: any, doc?: any): HTMLElement; abstract createHtmlDocument(): Document; abstract getDefaultDocument(): Document; abstract isElementNode(node: any): boolean; abstract isShadowRoot(node: any): boolean; abstract onAndCancel(el: any, evt: any, listener: any): Function; abstract getGlobalEventTarget(doc: Document, target: string): any; abstract getBaseHref(doc: Document): string | null; abstract resetBaseElement(): void; abstract getUserAgent(): string; abstract getCookie(name: string): string | null; } export declare function ɵgetDOM(): ɵDomAdapter; /** * Provides an empty implementation of the viewport scroller. */ export declare class ɵNullViewportScroller implements ViewportScroller { /** * Empty implementation */ setOffset(offset: [number, number] | (() => [number, number])): void; /** * Empty implementation */ getScrollPosition(): [number, number]; /** * Empty implementation */ scrollToPosition(position: [number, number]): void; /** * Empty implementation */ scrollToAnchor(anchor: string): void; /** * Empty implementation */ setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void; } export declare function ɵparseCookieValue(cookieStr: string, name: string): string | null; export declare const ɵPLATFORM_BROWSER_ID = "browser"; export declare const ɵPLATFORM_SERVER_ID = "server"; export declare const ɵPLATFORM_WORKER_APP_ID = "browserWorkerApp"; export declare const ɵPLATFORM_WORKER_UI_ID = "browserWorkerUi"; export declare function ɵsetRootDomAdapter(adapter: ɵDomAdapter): void; export { }