ApplicationRef

interface

npm Package	@angular/core
Module	import { ApplicationRef } from '@angular/core';
Source	core/src/application_ref.ts

Interface Overview

interface ApplicationRef { 
  get componentTypes: Type<any>[]
  get components: ComponentRef<any>[]
  get isStable: Observable<boolean>
  bootstrap<C>(componentOrFactory: ComponentFactory<C> | Type<C>, rootSelectorOrNode?: string | any): ComponentRef<C>
  tick(): void
  attachView(viewRef: ViewRef): void
  detachView(viewRef: ViewRef): void
  get viewCount
}

Description

A reference to an Angular application running on a page.

Members

get componentTypes: Type<any>[]

Get a list of component types registered to this application. This list is populated even before the component is created.

get components: ComponentRef<any>[]

Get a list of components registered to this application.

get isStable: Observable<boolean>

Returns an Observable that indicates when the application is stable or unstable.

bootstrap<C>(componentOrFactory: ComponentFactory<C> | Type<C>, rootSelectorOrNode?: string | any): ComponentRef<C>

Bootstrap a new component at the root level of the application.

Bootstrap process

When bootstrapping a new root component into an application, Angular mounts the specified application component onto DOM elements identified by the [componentType]'s selector and kicks off automatic change detection to finish initializing the component.

Optionally, a component can be mounted onto a DOM element that does not match the [componentType]'s selector.

Example

@Component({selector: 'my-app', template: 'Hello World'})
class MyApp {
}

const myPlatformFactory = createPlatformFactory(platformBrowserDynamic, 'myPlatform');
myPlatformFactory().bootstrapModule(MyApp);

tick(): void

Invoke this method to explicitly process change detection and its side-effects.

In development mode, tick() also performs a second change detection cycle to ensure that no further changes are detected. If additional changes are picked up during this second cycle, bindings in the app have side-effects that cannot be resolved in a single change detection pass. In this case, Angular throws an error, since an Angular application can only have one change detection pass during which all change detection must complete.

attachView(viewRef: ViewRef): void

Attaches a view so that it will be dirty checked. The view will be automatically detached when it is destroyed. This will throw if the view is already attached to a ViewContainer.

detachView(viewRef: ViewRef): void

Detaches a view from dirty checking again.

get viewCount

Returns the number of attached views.