fix(browser): platform code cleanup
This commit is contained in:
Victor Berchet
200
modules/@angular/platform-browser/src/browser.ts
Normal file
200
modules/@angular/platform-browser/src/browser.ts
Normal file
@ -0,0 +1,200 @@
|
||||
import {
|
||||
PLATFORM_INITIALIZER,
|
||||
PLATFORM_DIRECTIVES,
|
||||
PLATFORM_PIPES,
|
||||
ExceptionHandler,
|
||||
RootRenderer,
|
||||
APPLICATION_COMMON_PROVIDERS,
|
||||
PLATFORM_COMMON_PROVIDERS,
|
||||
OpaqueToken,
|
||||
Testability,
|
||||
PlatformRef,
|
||||
getPlatform,
|
||||
createPlatform,
|
||||
assertPlatform,
|
||||
ReflectiveInjector,
|
||||
reflector,
|
||||
coreLoadAndBootstrap,
|
||||
Type,
|
||||
ComponentRef
|
||||
} from "@angular/core";
|
||||
import {isBlank, isPresent} from "./facade/lang";
|
||||
import {wtfInit, SanitizationService, ReflectionCapabilities} from "../core_private";
|
||||
import {COMMON_DIRECTIVES, COMMON_PIPES, FORM_PROVIDERS, PlatformLocation} from "@angular/common";
|
||||
import {DomSanitizationService, DomSanitizationServiceImpl} from "./security/dom_sanitization_service";
|
||||
import {BrowserDomAdapter} from "./browser/browser_adapter";
|
||||
import {BrowserGetTestability} from "./browser/testability";
|
||||
import {getDOM} from "./dom/dom_adapter";
|
||||
import {DOCUMENT} from "./dom/dom_tokens";
|
||||
import {EVENT_MANAGER_PLUGINS, EventManager} from "./dom/events/event_manager";
|
||||
import {DomRootRenderer, DomRootRenderer_} from "./dom/dom_renderer";
|
||||
import {SharedStylesHost, DomSharedStylesHost} from "./dom/shared_styles_host";
|
||||
import {KeyEventsPlugin} from "./dom/events/key_events";
|
||||
import {ELEMENT_PROBE_PROVIDERS} from "./dom/debug/ng_probe";
|
||||
import {DomEventsPlugin} from "./dom/events/dom_events";
|
||||
import {HAMMER_GESTURE_CONFIG, HammerGestureConfig, HammerGesturesPlugin} from "./dom/events/hammer_gestures";
|
||||
import {AnimationBuilder} from "./animate/animation_builder";
|
||||
import {BrowserDetails} from "./animate/browser_details";
|
||||
import {BrowserPlatformLocation} from "./browser/location/browser_platform_location";
|
||||
import {COMPILER_PROVIDERS, XHR} from "@angular/compiler";
|
||||
import {CachedXHR} from "./xhr/xhr_cache";
|
||||
import {XHRImpl} from "./xhr/xhr_impl";
|
||||
|
||||
export const CACHED_TEMPLATE_PROVIDER: Array<any /*Type | Provider | any[]*/> =
|
||||
[{provide: XHR, useClass: CachedXHR}];
|
||||
|
||||
const BROWSER_PLATFORM_MARKER = new OpaqueToken('BrowserPlatformMarker');
|
||||
|
||||
/**
|
||||
* A set of providers to initialize the Angular platform in a web browser.
|
||||
*
|
||||
* Used automatically by `bootstrap`, or can be passed to {@link platform}.
|
||||
*/
|
||||
export const BROWSER_PLATFORM_PROVIDERS: Array<any /*Type | Provider | any[]*/> = [
|
||||
{provide: BROWSER_PLATFORM_MARKER, useValue: true},
|
||||
PLATFORM_COMMON_PROVIDERS,
|
||||
{provide: PLATFORM_INITIALIZER, useValue: initDomAdapter, multi: true},
|
||||
{provide: PlatformLocation, useClass: BrowserPlatformLocation}
|
||||
];
|
||||
|
||||
export const BROWSER_SANITIZATION_PROVIDERS: Array<any> = [
|
||||
{provide: SanitizationService, useExisting: DomSanitizationService},
|
||||
{provide: DomSanitizationService, useClass: DomSanitizationServiceImpl},
|
||||
];
|
||||
|
||||
/**
|
||||
* A set of providers to initialize an Angular application in a web browser.
|
||||
*
|
||||
* Used automatically by `bootstrap`, or can be passed to {@link PlatformRef.application}.
|
||||
*/
|
||||
export const BROWSER_APP_PROVIDERS: Array<any /*Type | Provider | any[]*/> =
|
||||
[
|
||||
APPLICATION_COMMON_PROVIDERS,
|
||||
FORM_PROVIDERS,
|
||||
BROWSER_SANITIZATION_PROVIDERS,
|
||||
{provide: PLATFORM_PIPES, useValue: COMMON_PIPES, multi: true},
|
||||
{provide: PLATFORM_DIRECTIVES, useValue: COMMON_DIRECTIVES, multi: true},
|
||||
{provide: ExceptionHandler, useFactory: _exceptionHandler, deps: []},
|
||||
{provide: DOCUMENT, useFactory: _document, deps: []},
|
||||
{provide: EVENT_MANAGER_PLUGINS, useClass: DomEventsPlugin, multi: true},
|
||||
{provide: EVENT_MANAGER_PLUGINS, useClass: KeyEventsPlugin, multi: true},
|
||||
{provide: EVENT_MANAGER_PLUGINS, useClass: HammerGesturesPlugin, multi: true},
|
||||
{provide: HAMMER_GESTURE_CONFIG, useClass: HammerGestureConfig},
|
||||
{provide: DomRootRenderer, useClass: DomRootRenderer_},
|
||||
{provide: RootRenderer, useExisting: DomRootRenderer},
|
||||
{provide: SharedStylesHost, useExisting: DomSharedStylesHost},
|
||||
DomSharedStylesHost,
|
||||
Testability,
|
||||
BrowserDetails,
|
||||
AnimationBuilder,
|
||||
EventManager,
|
||||
ELEMENT_PROBE_PROVIDERS
|
||||
];
|
||||
|
||||
export const BROWSER_APP_COMPILER_PROVIDERS: Array<any /*Type | Provider | any[]*/> =
|
||||
[
|
||||
COMPILER_PROVIDERS,
|
||||
{provide: XHR, useClass: XHRImpl},
|
||||
];
|
||||
|
||||
export function browserPlatform(): PlatformRef {
|
||||
if (isBlank(getPlatform())) {
|
||||
createPlatform(ReflectiveInjector.resolveAndCreate(BROWSER_PLATFORM_PROVIDERS));
|
||||
}
|
||||
return assertPlatform(BROWSER_PLATFORM_MARKER);
|
||||
}
|
||||
|
||||
/**
|
||||
* Bootstrapping for Angular applications.
|
||||
*
|
||||
* You instantiate an Angular application by explicitly specifying a component to use
|
||||
* as the root component for your application via the `bootstrap()` method.
|
||||
*
|
||||
* ## Simple Example
|
||||
*
|
||||
* Assuming this `index.html`:
|
||||
*
|
||||
* ```html
|
||||
* <html>
|
||||
* <!-- load Angular script tags here. -->
|
||||
* <body>
|
||||
* <my-app>loading...</my-app>
|
||||
* </body>
|
||||
* </html>
|
||||
* ```
|
||||
*
|
||||
* An application is bootstrapped inside an existing browser DOM, typically `index.html`.
|
||||
* Unlike Angular 1, Angular 2 does not compile/process providers in `index.html`. This is
|
||||
* mainly for security reasons, as well as architectural changes in Angular 2. This means
|
||||
* that `index.html` can safely be processed using server-side technologies such as
|
||||
* providers. Bindings can thus use double-curly `{{ syntax }}` without collision from
|
||||
* Angular 2 component double-curly `{{ syntax }}`.
|
||||
*
|
||||
* We can use this script code:
|
||||
*
|
||||
* {@example core/ts/bootstrap/bootstrap.ts region='bootstrap'}
|
||||
*
|
||||
* When the app developer invokes `bootstrap()` with the root component `MyApp` as its
|
||||
* argument, Angular performs the following tasks:
|
||||
*
|
||||
* 1. It uses the component's `selector` property to locate the DOM element which needs
|
||||
* to be upgraded into the angular component.
|
||||
* 2. It creates a new child injector (from the platform injector). Optionally, you can
|
||||
* also override the injector configuration for an app by invoking `bootstrap` with the
|
||||
* `componentInjectableBindings` argument.
|
||||
* 3. It creates a new `Zone` and connects it to the angular application's change detection
|
||||
* domain instance.
|
||||
* 4. It creates an emulated or shadow DOM on the selected component's host element and loads the
|
||||
* template into it.
|
||||
* 5. It instantiates the specified component.
|
||||
* 6. Finally, Angular performs change detection to apply the initial data providers for the
|
||||
* application.
|
||||
*
|
||||
*
|
||||
* ## Bootstrapping Multiple Applications
|
||||
*
|
||||
* When working within a browser window, there are many singleton resources: cookies, title,
|
||||
* location, and others. Angular services that represent these resources must likewise be
|
||||
* shared across all Angular applications that occupy the same browser window. For this
|
||||
* reason, Angular creates exactly one global platform object which stores all shared
|
||||
* services, and each angular application injector has the platform injector as its parent.
|
||||
*
|
||||
* Each application has its own private injector as well. When there are multiple
|
||||
* applications on a page, Angular treats each application injector's services as private
|
||||
* to that application.
|
||||
*
|
||||
* ## API
|
||||
*
|
||||
* - `appComponentType`: The root component which should act as the application. This is
|
||||
* a reference to a `Type` which is annotated with `@Component(...)`.
|
||||
* - `customProviders`: An additional set of providers that can be added to the
|
||||
* app injector to override default injection behavior.
|
||||
*
|
||||
* Returns a `Promise` of {@link ComponentRef}.
|
||||
*/
|
||||
export function bootstrap(
|
||||
appComponentType: Type,
|
||||
customProviders?: Array<any /*Type | Provider | any[]*/>): Promise<ComponentRef<any>> {
|
||||
reflector.reflectionCapabilities = new ReflectionCapabilities();
|
||||
let providers = [
|
||||
BROWSER_APP_PROVIDERS,
|
||||
BROWSER_APP_COMPILER_PROVIDERS,
|
||||
isPresent(customProviders) ? customProviders : []
|
||||
];
|
||||
var appInjector = ReflectiveInjector.resolveAndCreate(providers, browserPlatform().injector);
|
||||
return coreLoadAndBootstrap(appComponentType, appInjector);
|
||||
}
|
||||
|
||||
function initDomAdapter() {
|
||||
BrowserDomAdapter.makeCurrent();
|
||||
wtfInit();
|
||||
BrowserGetTestability.init();
|
||||
}
|
||||
|
||||
function _exceptionHandler(): ExceptionHandler {
|
||||
return new ExceptionHandler(getDOM());
|
||||
}
|
||||
|
||||
function _document(): any {
|
||||
return getDOM().defaultDoc();
|
||||
}
|
||||
Reference in New Issue
Block a user