Stable Class What it does Lifecycle hook that is called after a component's view has been fully initialized. How to use . @Component({selector: 'my-cmp', template: `...`}) class MyComponent implements AfterViewInit { ngAfterViewInit() { // ... } } Class Overview class AfterViewInit { ngAfterViewInit() : void } Class Description See Lifecycle Hooks Guide. Class Details ngAfterViewInit() : void exported from @angular/core/index, defined in @angular/core/src/metadata/lifecyc

Stable Class What it does Tracks the value and validation status of an individual form control. It is one of the three fundamental building blocks of Angular forms, along with FormGroup and FormArray. How to use When instantiating a FormControl, you can pass in an initial value as the first argument. Example: const ctrl = new FormControl('some value'); console.log(ctrl.value); // 'some value' You can also initialize the control with a form state object on instantiation, which includes

Stable Directive What it does Acts as a placeholder that Angular dynamically fills based on the current router state. How to use <router-outlet></router-outlet> <router-outlet name='left'></router-outlet> <router-outlet name='right'></router-outlet> A router outlet will emit an activate event any time a new component is being instantiated, and a deactivate event when it is being destroyed. <router-outlet (activate)='onActivate($event)' (deactivat

Stable Directive Class Overview class NgSelectOption { constructor(_element: ElementRef, _renderer: Renderer, _select: SelectControlValueAccessor) id : string ngValue value ngOnDestroy() } Selectors option Class Description Marks <option> as dynamic, so Angular can be notified when options change. Example <select name="city" ngModel> <option *ngFor="let c of cities" [value]="c"></option> </select> Constructor constructor(_element: Elem

Techniques for Dependency Injection Dependency Injection is a powerful pattern for managing code dependencies. In this cookbook we will explore many of the features of Dependency Injection (DI) in Angular. Table of contents Application-wide dependencies External module configuration @Injectable and nested service dependencies Limit service scope to a component subtree Multiple service instances (sandboxing) Qualify dependency lookup with @Optional and @Host Inject the component's DOM element De

Experimental Enum Class Overview class ReadyState { Unsent Open HeadersReceived Loading Done Cancelled } Class Description All possible states in which a connection can be, based on States from the XMLHttpRequest spec, but with an additional "CANCELLED" state. Class Details Unsent Open HeadersReceived Loading Done Cancelled exported from @angular/http/index, defined in @angular/http/src/enums.ts

Stable Interface What it does Contains the information about a route associated with a component loaded in an outlet at a particular moment in time. ActivatedRouteSnapshot can also be used to traverse the router state tree. How to use @Component({templateUrl:'./my-component.html'}) class MyComponent { constructor(route: ActivatedRoute) { const id: string = route.snapshot.params.id; const url: string = route.snapshot.url.join(''); const user = route.snapshot.data.user; } }

Experimental Class Class Overview class WorkerAppModule { } Class Description The ng module for the worker app side. Annotations @NgModule({ providers: [ BROWSER_SANITIZATION_PROVIDERS, Serializer, {provide: ClientMessageBrokerFactory, useClass: ClientMessageBrokerFactory_}, {provide: ServiceMessageBrokerFactory, useClass: ServiceMessageBrokerFactory_}, WebWorkerRootRenderer, {provide: RootRenderer, useExisting: WebWorkerRootRenderer}, {provide: ON_WEB_WORKER, useVa

Experimental Function Class Export export forwardRef(forwardRefFn: ForwardRefFn) : Type<any> Allows to refer to references which are not yet defined. For instance, forwardRef is used when the token which we need to refer to for the purposes of DI is declared, but not yet defined. It is also used when the token which we use when creating a query is not yet defined. Example class Door { lock: Lock; // Door attempts to inject Lock, despite it not being defined yet. // forwardRef ma

Experimental Class Class Overview class ServerModule { } Class Description The ng module for the server. Annotations @NgModule({imports: [BrowserModule]}) exported from @angular/platform-server/index, defined in @angular/platform-server/src/server.ts