1 | /**
|
2 | * @license Angular v15.1.2
|
3 | * (c) 2010-2022 Google LLC. https://angular.io/
|
4 | * License: MIT
|
5 | */
|
6 |
|
7 |
|
8 | import { DoCheck } from '@angular/core';
|
9 | import { ElementRef } from '@angular/core';
|
10 | import * as i0 from '@angular/core';
|
11 | import { Injector } from '@angular/core';
|
12 | import { NgModuleFactory } from '@angular/core';
|
13 | import { NgModuleRef } from '@angular/core';
|
14 | import { NgZone } from '@angular/core';
|
15 | import { OnChanges } from '@angular/core';
|
16 | import { OnDestroy } from '@angular/core';
|
17 | import { OnInit } from '@angular/core';
|
18 | import { PlatformRef } from '@angular/core';
|
19 | import { SimpleChanges } from '@angular/core';
|
20 | import { StaticProvider } from '@angular/core';
|
21 | import { Type } from '@angular/core';
|
22 | import { Version } from '@angular/core';
|
23 |
|
24 | /**
|
25 | * @description
|
26 | *
|
27 | * A helper function that allows an Angular component to be used from AngularJS.
|
28 | *
|
29 | * *Part of the [upgrade/static](api?query=upgrade%2Fstatic)
|
30 | * library for hybrid upgrade apps that support AOT compilation*
|
31 | *
|
32 | * This helper function returns a factory function to be used for registering
|
33 | * an AngularJS wrapper directive for "downgrading" an Angular component.
|
34 | *
|
35 | * @usageNotes
|
36 | * ### Examples
|
37 | *
|
38 | * Let's assume that you have an Angular component called `ng2Heroes` that needs
|
39 | * to be made available in AngularJS templates.
|
40 | *
|
41 | * {@example upgrade/static/ts/full/module.ts region="ng2-heroes"}
|
42 | *
|
43 | * We must create an AngularJS [directive](https://docs.angularjs.org/guide/directive)
|
44 | * that will make this Angular component available inside AngularJS templates.
|
45 | * The `downgradeComponent()` function returns a factory function that we
|
46 | * can use to define the AngularJS directive that wraps the "downgraded" component.
|
47 | *
|
48 | * {@example upgrade/static/ts/full/module.ts region="ng2-heroes-wrapper"}
|
49 | *
|
50 | * For more details and examples on downgrading Angular components to AngularJS components please
|
51 | * visit the [Upgrade guide](guide/upgrade#using-angular-components-from-angularjs-code).
|
52 | *
|
53 | * @param info contains information about the Component that is being downgraded:
|
54 | *
|
55 | * - `component: Type<any>`: The type of the Component that will be downgraded
|
56 | * - `downgradedModule?: string`: The name of the downgraded module (if any) that the component
|
57 | * "belongs to", as returned by a call to `downgradeModule()`. It is the module, whose
|
58 | * corresponding Angular module will be bootstrapped, when the component needs to be instantiated.
|
59 | * <br />
|
60 | * (This option is only necessary when using `downgradeModule()` to downgrade more than one
|
61 | * Angular module.)
|
62 | * - `propagateDigest?: boolean`: Whether to perform {@link ChangeDetectorRef#detectChanges
|
63 | * change detection} on the component on every
|
64 | * [$digest](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest). If set to `false`,
|
65 | * change detection will still be performed when any of the component's inputs changes.
|
66 | * (Default: true)
|
67 | *
|
68 | * @returns a factory function that can be used to register the component in an
|
69 | * AngularJS module.
|
70 | *
|
71 | * @publicApi
|
72 | */
|
73 | export declare function downgradeComponent(info: {
|
74 | component: Type<any>;
|
75 | downgradedModule?: string;
|
76 | propagateDigest?: boolean;
|
77 | /** @deprecated since v4. This parameter is no longer used */
|
78 | inputs?: string[];
|
79 | /** @deprecated since v4. This parameter is no longer used */
|
80 | outputs?: string[];
|
81 | /** @deprecated since v4. This parameter is no longer used */
|
82 | selectors?: string[];
|
83 | }): any;
|
84 |
|
85 |
|
86 | /**
|
87 | * @description
|
88 | *
|
89 | * A helper function to allow an Angular service to be accessible from AngularJS.
|
90 | *
|
91 | * *Part of the [upgrade/static](api?query=upgrade%2Fstatic)
|
92 | * library for hybrid upgrade apps that support AOT compilation*
|
93 | *
|
94 | * This helper function returns a factory function that provides access to the Angular
|
95 | * service identified by the `token` parameter.
|
96 | *
|
97 | * @usageNotes
|
98 | * ### Examples
|
99 | *
|
100 | * First ensure that the service to be downgraded is provided in an `NgModule`
|
101 | * that will be part of the upgrade application. For example, let's assume we have
|
102 | * defined `HeroesService`
|
103 | *
|
104 | * {@example upgrade/static/ts/full/module.ts region="ng2-heroes-service"}
|
105 | *
|
106 | * and that we have included this in our upgrade app `NgModule`
|
107 | *
|
108 | * {@example upgrade/static/ts/full/module.ts region="ng2-module"}
|
109 | *
|
110 | * Now we can register the `downgradeInjectable` factory function for the service
|
111 | * on an AngularJS module.
|
112 | *
|
113 | * {@example upgrade/static/ts/full/module.ts region="downgrade-ng2-heroes-service"}
|
114 | *
|
115 | * Inside an AngularJS component's controller we can get hold of the
|
116 | * downgraded service via the name we gave when downgrading.
|
117 | *
|
118 | * {@example upgrade/static/ts/full/module.ts region="example-app"}
|
119 | *
|
120 | * <div class="alert is-important">
|
121 | *
|
122 | * When using `downgradeModule()`, downgraded injectables will not be available until the Angular
|
123 | * module that provides them is instantiated. In order to be safe, you need to ensure that the
|
124 | * downgraded injectables are not used anywhere _outside_ the part of the app where it is
|
125 | * guaranteed that their module has been instantiated.
|
126 | *
|
127 | * For example, it is _OK_ to use a downgraded service in an upgraded component that is only used
|
128 | * from a downgraded Angular component provided by the same Angular module as the injectable, but
|
129 | * it is _not OK_ to use it in an AngularJS component that may be used independently of Angular or
|
130 | * use it in a downgraded Angular component from a different module.
|
131 | *
|
132 | * </div>
|
133 | *
|
134 | * @param token an `InjectionToken` that identifies a service provided from Angular.
|
135 | * @param downgradedModule the name of the downgraded module (if any) that the injectable
|
136 | * "belongs to", as returned by a call to `downgradeModule()`. It is the module, whose injector will
|
137 | * be used for instantiating the injectable.<br />
|
138 | * (This option is only necessary when using `downgradeModule()` to downgrade more than one Angular
|
139 | * module.)
|
140 | *
|
141 | * @returns a [factory function](https://docs.angularjs.org/guide/di) that can be
|
142 | * used to register the service on an AngularJS module.
|
143 | *
|
144 | * @publicApi
|
145 | */
|
146 | export declare function downgradeInjectable(token: any, downgradedModule?: string): Function;
|
147 |
|
148 | /**
|
149 | * @description
|
150 | *
|
151 | * A helper function for creating an AngularJS module that can bootstrap an Angular module
|
152 | * "on-demand" (possibly lazily) when a {@link downgradeComponent downgraded component} needs to be
|
153 | * instantiated.
|
154 | *
|
155 | * *Part of the [upgrade/static](api?query=upgrade/static) library for hybrid upgrade apps that
|
156 | * support AOT compilation.*
|
157 | *
|
158 | * It allows loading/bootstrapping the Angular part of a hybrid application lazily and not having to
|
159 | * pay the cost up-front. For example, you can have an AngularJS application that uses Angular for
|
160 | * specific routes and only instantiate the Angular modules if/when the user visits one of these
|
161 | * routes.
|
162 | *
|
163 | * The Angular module will be bootstrapped once (when requested for the first time) and the same
|
164 | * reference will be used from that point onwards.
|
165 | *
|
166 | * `downgradeModule()` requires either an `NgModuleFactory`, `NgModule` class or a function:
|
167 | * - `NgModuleFactory`: If you pass an `NgModuleFactory`, it will be used to instantiate a module
|
168 | * using `platformBrowser`'s {@link PlatformRef#bootstrapModuleFactory bootstrapModuleFactory()}.
|
169 | * NOTE: this type of the argument is deprecated. Please either provide an `NgModule` class or a
|
170 | * bootstrap function instead.
|
171 | * - `NgModule` class: If you pass an NgModule class, it will be used to instantiate a module
|
172 | * using `platformBrowser`'s {@link PlatformRef#bootstrapModule bootstrapModule()}.
|
173 | * - `Function`: If you pass a function, it is expected to return a promise resolving to an
|
174 | * `NgModuleRef`. The function is called with an array of extra {@link StaticProvider Providers}
|
175 | * that are expected to be available from the returned `NgModuleRef`'s `Injector`.
|
176 | *
|
177 | * `downgradeModule()` returns the name of the created AngularJS wrapper module. You can use it to
|
178 | * declare a dependency in your main AngularJS module.
|
179 | *
|
180 | * {@example upgrade/static/ts/lite/module.ts region="basic-how-to"}
|
181 | *
|
182 | * For more details on how to use `downgradeModule()` see
|
183 | * [Upgrading for Performance](guide/upgrade-performance).
|
184 | *
|
185 | * @usageNotes
|
186 | *
|
187 | * Apart from `UpgradeModule`, you can use the rest of the `upgrade/static` helpers as usual to
|
188 | * build a hybrid application. Note that the Angular pieces (e.g. downgraded services) will not be
|
189 | * available until the downgraded module has been bootstrapped, i.e. by instantiating a downgraded
|
190 | * component.
|
191 | *
|
192 | * <div class="alert is-important">
|
193 | *
|
194 | * You cannot use `downgradeModule()` and `UpgradeModule` in the same hybrid application.<br />
|
195 | * Use one or the other.
|
196 | *
|
197 | * </div>
|
198 | *
|
199 | * ### Differences with `UpgradeModule`
|
200 | *
|
201 | * Besides their different API, there are two important internal differences between
|
202 | * `downgradeModule()` and `UpgradeModule` that affect the behavior of hybrid applications:
|
203 | *
|
204 | * 1. Unlike `UpgradeModule`, `downgradeModule()` does not bootstrap the main AngularJS module
|
205 | * inside the {@link NgZone Angular zone}.
|
206 | * 2. Unlike `UpgradeModule`, `downgradeModule()` does not automatically run a
|
207 | * [$digest()](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest) when changes are
|
208 | * detected in the Angular part of the application.
|
209 | *
|
210 | * What this means is that applications using `UpgradeModule` will run change detection more
|
211 | * frequently in order to ensure that both frameworks are properly notified about possible changes.
|
212 | * This will inevitably result in more change detection runs than necessary.
|
213 | *
|
214 | * `downgradeModule()`, on the other side, does not try to tie the two change detection systems as
|
215 | * tightly, restricting the explicit change detection runs only to cases where it knows it is
|
216 | * necessary (e.g. when the inputs of a downgraded component change). This improves performance,
|
217 | * especially in change-detection-heavy applications, but leaves it up to the developer to manually
|
218 | * notify each framework as needed.
|
219 | *
|
220 | * For a more detailed discussion of the differences and their implications, see
|
221 | * [Upgrading for Performance](guide/upgrade-performance).
|
222 | *
|
223 | * <div class="alert is-helpful">
|
224 | *
|
225 | * You can manually trigger a change detection run in AngularJS using
|
226 | * [scope.$apply(...)](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$apply) or
|
227 | * [$rootScope.$digest()](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest).
|
228 | *
|
229 | * You can manually trigger a change detection run in Angular using {@link NgZone#run
|
230 | * ngZone.run(...)}.
|
231 | *
|
232 | * </div>
|
233 | *
|
234 | * ### Downgrading multiple modules
|
235 | *
|
236 | * It is possible to downgrade multiple modules and include them in an AngularJS application. In
|
237 | * that case, each downgraded module will be bootstrapped when an associated downgraded component or
|
238 | * injectable needs to be instantiated.
|
239 | *
|
240 | * Things to keep in mind, when downgrading multiple modules:
|
241 | *
|
242 | * - Each downgraded component/injectable needs to be explicitly associated with a downgraded
|
243 | * module. See `downgradeComponent()` and `downgradeInjectable()` for more details.
|
244 | *
|
245 | * - If you want some injectables to be shared among all downgraded modules, you can provide them as
|
246 | * `StaticProvider`s, when creating the `PlatformRef` (e.g. via `platformBrowser` or
|
247 | * `platformBrowserDynamic`).
|
248 | *
|
249 | * - When using {@link PlatformRef#bootstrapmodule `bootstrapModule()`} or
|
250 | * {@link PlatformRef#bootstrapmodulefactory `bootstrapModuleFactory()`} to bootstrap the
|
251 | * downgraded modules, each one is considered a "root" module. As a consequence, a new instance
|
252 | * will be created for every injectable provided in `"root"` (via
|
253 | * {@link Injectable#providedIn `providedIn`}).
|
254 | * If this is not your intention, you can have a shared module (that will act as act as the "root"
|
255 | * module) and create all downgraded modules using that module's injector:
|
256 | *
|
257 | * {@example upgrade/static/ts/lite-multi-shared/module.ts region="shared-root-module"}
|
258 | *
|
259 | * @publicApi
|
260 | */
|
261 | export declare function downgradeModule<T>(moduleOrBootstrapFn: Type<T> | ((extraProviders: StaticProvider[]) => Promise<NgModuleRef<T>>)): string;
|
262 |
|
263 | /**
|
264 | * @description
|
265 | *
|
266 | * A helper function for creating an AngularJS module that can bootstrap an Angular module
|
267 | * "on-demand" (possibly lazily) when a {@link downgradeComponent downgraded component} needs to be
|
268 | * instantiated.
|
269 | *
|
270 | * *Part of the [upgrade/static](api?query=upgrade/static) library for hybrid upgrade apps that
|
271 | * support AOT compilation.*
|
272 | *
|
273 | * It allows loading/bootstrapping the Angular part of a hybrid application lazily and not having to
|
274 | * pay the cost up-front. For example, you can have an AngularJS application that uses Angular for
|
275 | * specific routes and only instantiate the Angular modules if/when the user visits one of these
|
276 | * routes.
|
277 | *
|
278 | * The Angular module will be bootstrapped once (when requested for the first time) and the same
|
279 | * reference will be used from that point onwards.
|
280 | *
|
281 | * `downgradeModule()` requires either an `NgModuleFactory`, `NgModule` class or a function:
|
282 | * - `NgModuleFactory`: If you pass an `NgModuleFactory`, it will be used to instantiate a module
|
283 | * using `platformBrowser`'s {@link PlatformRef#bootstrapModuleFactory bootstrapModuleFactory()}.
|
284 | * NOTE: this type of the argument is deprecated. Please either provide an `NgModule` class or a
|
285 | * bootstrap function instead.
|
286 | * - `NgModule` class: If you pass an NgModule class, it will be used to instantiate a module
|
287 | * using `platformBrowser`'s {@link PlatformRef#bootstrapModule bootstrapModule()}.
|
288 | * - `Function`: If you pass a function, it is expected to return a promise resolving to an
|
289 | * `NgModuleRef`. The function is called with an array of extra {@link StaticProvider Providers}
|
290 | * that are expected to be available from the returned `NgModuleRef`'s `Injector`.
|
291 | *
|
292 | * `downgradeModule()` returns the name of the created AngularJS wrapper module. You can use it to
|
293 | * declare a dependency in your main AngularJS module.
|
294 | *
|
295 | * {@example upgrade/static/ts/lite/module.ts region="basic-how-to"}
|
296 | *
|
297 | * For more details on how to use `downgradeModule()` see
|
298 | * [Upgrading for Performance](guide/upgrade-performance).
|
299 | *
|
300 | * @usageNotes
|
301 | *
|
302 | * Apart from `UpgradeModule`, you can use the rest of the `upgrade/static` helpers as usual to
|
303 | * build a hybrid application. Note that the Angular pieces (e.g. downgraded services) will not be
|
304 | * available until the downgraded module has been bootstrapped, i.e. by instantiating a downgraded
|
305 | * component.
|
306 | *
|
307 | * <div class="alert is-important">
|
308 | *
|
309 | * You cannot use `downgradeModule()` and `UpgradeModule` in the same hybrid application.<br />
|
310 | * Use one or the other.
|
311 | *
|
312 | * </div>
|
313 | *
|
314 | * ### Differences with `UpgradeModule`
|
315 | *
|
316 | * Besides their different API, there are two important internal differences between
|
317 | * `downgradeModule()` and `UpgradeModule` that affect the behavior of hybrid applications:
|
318 | *
|
319 | * 1. Unlike `UpgradeModule`, `downgradeModule()` does not bootstrap the main AngularJS module
|
320 | * inside the {@link NgZone Angular zone}.
|
321 | * 2. Unlike `UpgradeModule`, `downgradeModule()` does not automatically run a
|
322 | * [$digest()](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest) when changes are
|
323 | * detected in the Angular part of the application.
|
324 | *
|
325 | * What this means is that applications using `UpgradeModule` will run change detection more
|
326 | * frequently in order to ensure that both frameworks are properly notified about possible changes.
|
327 | * This will inevitably result in more change detection runs than necessary.
|
328 | *
|
329 | * `downgradeModule()`, on the other side, does not try to tie the two change detection systems as
|
330 | * tightly, restricting the explicit change detection runs only to cases where it knows it is
|
331 | * necessary (e.g. when the inputs of a downgraded component change). This improves performance,
|
332 | * especially in change-detection-heavy applications, but leaves it up to the developer to manually
|
333 | * notify each framework as needed.
|
334 | *
|
335 | * For a more detailed discussion of the differences and their implications, see
|
336 | * [Upgrading for Performance](guide/upgrade-performance).
|
337 | *
|
338 | * <div class="alert is-helpful">
|
339 | *
|
340 | * You can manually trigger a change detection run in AngularJS using
|
341 | * [scope.$apply(...)](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$apply) or
|
342 | * [$rootScope.$digest()](https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$digest).
|
343 | *
|
344 | * You can manually trigger a change detection run in Angular using {@link NgZone#run
|
345 | * ngZone.run(...)}.
|
346 | *
|
347 | * </div>
|
348 | *
|
349 | * ### Downgrading multiple modules
|
350 | *
|
351 | * It is possible to downgrade multiple modules and include them in an AngularJS application. In
|
352 | * that case, each downgraded module will be bootstrapped when an associated downgraded component or
|
353 | * injectable needs to be instantiated.
|
354 | *
|
355 | * Things to keep in mind, when downgrading multiple modules:
|
356 | *
|
357 | * - Each downgraded component/injectable needs to be explicitly associated with a downgraded
|
358 | * module. See `downgradeComponent()` and `downgradeInjectable()` for more details.
|
359 | *
|
360 | * - If you want some injectables to be shared among all downgraded modules, you can provide them as
|
361 | * `StaticProvider`s, when creating the `PlatformRef` (e.g. via `platformBrowser` or
|
362 | * `platformBrowserDynamic`).
|
363 | *
|
364 | * - When using {@link PlatformRef#bootstrapmodule `bootstrapModule()`} or
|
365 | * {@link PlatformRef#bootstrapmodulefactory `bootstrapModuleFactory()`} to bootstrap the
|
366 | * downgraded modules, each one is considered a "root" module. As a consequence, a new instance
|
367 | * will be created for every injectable provided in `"root"` (via
|
368 | * {@link Injectable#providedIn `providedIn`}).
|
369 | * If this is not your intention, you can have a shared module (that will act as act as the "root"
|
370 | * module) and create all downgraded modules using that module's injector:
|
371 | *
|
372 | * {@example upgrade/static/ts/lite-multi-shared/module.ts region="shared-root-module"}
|
373 | *
|
374 | * @publicApi
|
375 | *
|
376 | * @deprecated Passing `NgModuleFactory` as the `downgradeModule` function argument is deprecated,
|
377 | * please pass an NgModule class reference instead.
|
378 | */
|
379 | export declare function downgradeModule<T>(moduleOrBootstrapFn: NgModuleFactory<T>): string;
|
380 |
|
381 | /**
|
382 | * Returns the current AngularJS global.
|
383 | *
|
384 | * @publicApi
|
385 | */
|
386 | export declare function getAngularJSGlobal(): any;
|
387 |
|
388 | /**
|
389 | * @deprecated Use `getAngularJSGlobal` instead.
|
390 | *
|
391 | * @publicApi
|
392 | */
|
393 | export declare function getAngularLib(): any;
|
394 |
|
395 | /**
|
396 | * Resets the AngularJS global.
|
397 | *
|
398 | * Used when AngularJS is loaded lazily, and not available on `window`.
|
399 | *
|
400 | * @publicApi
|
401 | */
|
402 | export declare function setAngularJSGlobal(ng: any): void;
|
403 |
|
404 | /**
|
405 | * @deprecated Use `setAngularJSGlobal` instead.
|
406 | *
|
407 | * @publicApi
|
408 | */
|
409 | export declare function setAngularLib(ng: any): void;
|
410 |
|
411 | /**
|
412 | * @description
|
413 | *
|
414 | * A helper class that allows an AngularJS component to be used from Angular.
|
415 | *
|
416 | * *Part of the [upgrade/static](api?query=upgrade%2Fstatic)
|
417 | * library for hybrid upgrade apps that support AOT compilation.*
|
418 | *
|
419 | * This helper class should be used as a base class for creating Angular directives
|
420 | * that wrap AngularJS components that need to be "upgraded".
|
421 | *
|
422 | * @usageNotes
|
423 | * ### Examples
|
424 | *
|
425 | * Let's assume that you have an AngularJS component called `ng1Hero` that needs
|
426 | * to be made available in Angular templates.
|
427 | *
|
428 | * {@example upgrade/static/ts/full/module.ts region="ng1-hero"}
|
429 | *
|
430 | * We must create a `Directive` that will make this AngularJS component
|
431 | * available inside Angular templates.
|
432 | *
|
433 | * {@example upgrade/static/ts/full/module.ts region="ng1-hero-wrapper"}
|
434 | *
|
435 | * In this example you can see that we must derive from the `UpgradeComponent`
|
436 | * base class but also provide an {@link Directive `@Directive`} decorator. This is
|
437 | * because the AOT compiler requires that this information is statically available at
|
438 | * compile time.
|
439 | *
|
440 | * Note that we must do the following:
|
441 | * * specify the directive's selector (`ng1-hero`)
|
442 | * * specify all inputs and outputs that the AngularJS component expects
|
443 | * * derive from `UpgradeComponent`
|
444 | * * call the base class from the constructor, passing
|
445 | * * the AngularJS name of the component (`ng1Hero`)
|
446 | * * the `ElementRef` and `Injector` for the component wrapper
|
447 | *
|
448 | * @publicApi
|
449 | * @extensible
|
450 | */
|
451 | export declare class UpgradeComponent implements OnInit, OnChanges, DoCheck, OnDestroy {
|
452 | private name;
|
453 | private elementRef;
|
454 | private injector;
|
455 | private helper;
|
456 | private $injector;
|
457 | private element;
|
458 | private $element;
|
459 | private $componentScope;
|
460 | private directive;
|
461 | private bindings;
|
462 | private controllerInstance;
|
463 | private bindingDestination;
|
464 | private pendingChanges;
|
465 | private unregisterDoCheckWatcher;
|
466 | /**
|
467 | * Create a new `UpgradeComponent` instance. You should not normally need to do this.
|
468 | * Instead you should derive a new class from this one and call the super constructor
|
469 | * from the base class.
|
470 | *
|
471 | * {@example upgrade/static/ts/full/module.ts region="ng1-hero-wrapper" }
|
472 | *
|
473 | * * The `name` parameter should be the name of the AngularJS directive.
|
474 | * * The `elementRef` and `injector` parameters should be acquired from Angular by dependency
|
475 | * injection into the base class constructor.
|
476 | */
|
477 | constructor(name: string, elementRef: ElementRef, injector: Injector);
|
478 | ngOnInit(): void;
|
479 | ngOnChanges(changes: SimpleChanges): void;
|
480 | ngDoCheck(): void;
|
481 | ngOnDestroy(): void;
|
482 | private initializeBindings;
|
483 | private initializeOutputs;
|
484 | private bindOutputs;
|
485 | private forwardChanges;
|
486 | static ɵfac: i0.ɵɵFactoryDeclaration<UpgradeComponent, never>;
|
487 | static ɵdir: i0.ɵɵDirectiveDeclaration<UpgradeComponent, never, never, {}, {}, never, never, false, never>;
|
488 | }
|
489 |
|
490 | /**
|
491 | * @description
|
492 | *
|
493 | * An `NgModule`, which you import to provide AngularJS core services,
|
494 | * and has an instance method used to bootstrap the hybrid upgrade application.
|
495 | *
|
496 | * *Part of the [upgrade/static](api?query=upgrade/static)
|
497 | * library for hybrid upgrade apps that support AOT compilation*
|
498 | *
|
499 | * The `upgrade/static` package contains helpers that allow AngularJS and Angular components
|
500 | * to be used together inside a hybrid upgrade application, which supports AOT compilation.
|
501 | *
|
502 | * Specifically, the classes and functions in the `upgrade/static` module allow the following:
|
503 | *
|
504 | * 1. Creation of an Angular directive that wraps and exposes an AngularJS component so
|
505 | * that it can be used in an Angular template. See `UpgradeComponent`.
|
506 | * 2. Creation of an AngularJS directive that wraps and exposes an Angular component so
|
507 | * that it can be used in an AngularJS template. See `downgradeComponent`.
|
508 | * 3. Creation of an Angular root injector provider that wraps and exposes an AngularJS
|
509 | * service so that it can be injected into an Angular context. See
|
510 | * {@link UpgradeModule#upgrading-an-angular-1-service Upgrading an AngularJS service} below.
|
511 | * 4. Creation of an AngularJS service that wraps and exposes an Angular injectable
|
512 | * so that it can be injected into an AngularJS context. See `downgradeInjectable`.
|
513 | * 3. Bootstrapping of a hybrid Angular application which contains both of the frameworks
|
514 | * coexisting in a single application.
|
515 | *
|
516 | * @usageNotes
|
517 | *
|
518 | * ```ts
|
519 | * import {UpgradeModule} from '@angular/upgrade/static';
|
520 | * ```
|
521 | *
|
522 | * See also the {@link UpgradeModule#examples examples} below.
|
523 | *
|
524 | * ### Mental Model
|
525 | *
|
526 | * When reasoning about how a hybrid application works it is useful to have a mental model which
|
527 | * describes what is happening and explains what is happening at the lowest level.
|
528 | *
|
529 | * 1. There are two independent frameworks running in a single application, each framework treats
|
530 | * the other as a black box.
|
531 | * 2. Each DOM element on the page is owned exactly by one framework. Whichever framework
|
532 | * instantiated the element is the owner. Each framework only updates/interacts with its own
|
533 | * DOM elements and ignores others.
|
534 | * 3. AngularJS directives always execute inside the AngularJS framework codebase regardless of
|
535 | * where they are instantiated.
|
536 | * 4. Angular components always execute inside the Angular framework codebase regardless of
|
537 | * where they are instantiated.
|
538 | * 5. An AngularJS component can be "upgraded"" to an Angular component. This is achieved by
|
539 | * defining an Angular directive, which bootstraps the AngularJS component at its location
|
540 | * in the DOM. See `UpgradeComponent`.
|
541 | * 6. An Angular component can be "downgraded" to an AngularJS component. This is achieved by
|
542 | * defining an AngularJS directive, which bootstraps the Angular component at its location
|
543 | * in the DOM. See `downgradeComponent`.
|
544 | * 7. Whenever an "upgraded"/"downgraded" component is instantiated the host element is owned by
|
545 | * the framework doing the instantiation. The other framework then instantiates and owns the
|
546 | * view for that component.
|
547 | * 1. This implies that the component bindings will always follow the semantics of the
|
548 | * instantiation framework.
|
549 | * 2. The DOM attributes are parsed by the framework that owns the current template. So
|
550 | * attributes in AngularJS templates must use kebab-case, while AngularJS templates must use
|
551 | * camelCase.
|
552 | * 3. However the template binding syntax will always use the Angular style, e.g. square
|
553 | * brackets (`[...]`) for property binding.
|
554 | * 8. Angular is bootstrapped first; AngularJS is bootstrapped second. AngularJS always owns the
|
555 | * root component of the application.
|
556 | * 9. The new application is running in an Angular zone, and therefore it no longer needs calls to
|
557 | * `$apply()`.
|
558 | *
|
559 | * ### The `UpgradeModule` class
|
560 | *
|
561 | * This class is an `NgModule`, which you import to provide AngularJS core services,
|
562 | * and has an instance method used to bootstrap the hybrid upgrade application.
|
563 | *
|
564 | * * Core AngularJS services<br />
|
565 | * Importing this `NgModule` will add providers for the core
|
566 | * [AngularJS services](https://docs.angularjs.org/api/ng/service) to the root injector.
|
567 | *
|
568 | * * Bootstrap<br />
|
569 | * The runtime instance of this class contains a {@link UpgradeModule#bootstrap `bootstrap()`}
|
570 | * method, which you use to bootstrap the top level AngularJS module onto an element in the
|
571 | * DOM for the hybrid upgrade app.
|
572 | *
|
573 | * It also contains properties to access the {@link UpgradeModule#injector root injector}, the
|
574 | * bootstrap `NgZone` and the
|
575 | * [AngularJS $injector](https://docs.angularjs.org/api/auto/service/$injector).
|
576 | *
|
577 | * ### Examples
|
578 | *
|
579 | * Import the `UpgradeModule` into your top level {@link NgModule Angular `NgModule`}.
|
580 | *
|
581 | * {@example upgrade/static/ts/full/module.ts region='ng2-module'}
|
582 | *
|
583 | * Then inject `UpgradeModule` into your Angular `NgModule` and use it to bootstrap the top level
|
584 | * [AngularJS module](https://docs.angularjs.org/api/ng/type/angular.Module) in the
|
585 | * `ngDoBootstrap()` method.
|
586 | *
|
587 | * {@example upgrade/static/ts/full/module.ts region='bootstrap-ng1'}
|
588 | *
|
589 | * Finally, kick off the whole process, by bootstrapping your top level Angular `NgModule`.
|
590 | *
|
591 | * {@example upgrade/static/ts/full/module.ts region='bootstrap-ng2'}
|
592 | *
|
593 | * {@a upgrading-an-angular-1-service}
|
594 | * ### Upgrading an AngularJS service
|
595 | *
|
596 | * There is no specific API for upgrading an AngularJS service. Instead you should just follow the
|
597 | * following recipe:
|
598 | *
|
599 | * Let's say you have an AngularJS service:
|
600 | *
|
601 | * {@example upgrade/static/ts/full/module.ts region="ng1-text-formatter-service"}
|
602 | *
|
603 | * Then you should define an Angular provider to be included in your `NgModule` `providers`
|
604 | * property.
|
605 | *
|
606 | * {@example upgrade/static/ts/full/module.ts region="upgrade-ng1-service"}
|
607 | *
|
608 | * Then you can use the "upgraded" AngularJS service by injecting it into an Angular component
|
609 | * or service.
|
610 | *
|
611 | * {@example upgrade/static/ts/full/module.ts region="use-ng1-upgraded-service"}
|
612 | *
|
613 | * @publicApi
|
614 | */
|
615 | export declare class UpgradeModule {
|
616 | /** The bootstrap zone for the upgrade application */
|
617 | ngZone: NgZone;
|
618 | /**
|
619 | * The owning `NgModuleRef`s `PlatformRef` instance.
|
620 | * This is used to tie the lifecycle of the bootstrapped AngularJS apps to that of the Angular
|
621 | * `PlatformRef`.
|
622 | */
|
623 | private platformRef;
|
624 | /**
|
625 | * The AngularJS `$injector` for the upgrade application.
|
626 | */
|
627 | $injector: any;
|
628 | /** The Angular Injector **/
|
629 | injector: Injector;
|
630 | constructor(
|
631 | /** The root `Injector` for the upgrade application. */
|
632 | injector: Injector,
|
633 | /** The bootstrap zone for the upgrade application */
|
634 | ngZone: NgZone,
|
635 | /**
|
636 | * The owning `NgModuleRef`s `PlatformRef` instance.
|
637 | * This is used to tie the lifecycle of the bootstrapped AngularJS apps to that of the Angular
|
638 | * `PlatformRef`.
|
639 | */
|
640 | platformRef: PlatformRef);
|
641 | /**
|
642 | * Bootstrap an AngularJS application from this NgModule
|
643 | * @param element the element on which to bootstrap the AngularJS application
|
644 | * @param [modules] the AngularJS modules to bootstrap for this application
|
645 | * @param [config] optional extra AngularJS bootstrap configuration
|
646 | * @return The value returned by
|
647 | * [angular.bootstrap()](https://docs.angularjs.org/api/ng/function/angular.bootstrap).
|
648 | */
|
649 | bootstrap(element: Element, modules?: string[], config?: any): any;
|
650 | static ɵfac: i0.ɵɵFactoryDeclaration<UpgradeModule, never>;
|
651 | static ɵmod: i0.ɵɵNgModuleDeclaration<UpgradeModule, never, never, never>;
|
652 | static ɵinj: i0.ɵɵInjectorDeclaration<UpgradeModule>;
|
653 | }
|
654 |
|
655 | /**
|
656 | * @publicApi
|
657 | */
|
658 | export declare const VERSION: Version;
|
659 |
|
660 | export { }
|
661 |
|
\ | No newline at end of file |