Stable Class What it does Creates an AbstractControl from a user-specified configuration. It is essentially syntactic sugar that shortens the new FormGroup(), new FormControl(), and new FormArray() boilerplate that can build up in larger forms. How to use To use, inject FormBuilder into your component class. You can then call its methods directly. import {Component, Inject} from '@angular/core'; import {FormBuilder, FormGroup, Validators} from '@angular/forms'; @Component({ selector: 'e

Stable Directive What it does Syncs a nested FormArray to a DOM element. How to use This directive is designed to be used with a parent FormGroupDirective (selector: [formGroup]). It accepts the string name of the nested FormArray you want to link, and will look for a FormArray registered with that name in the parent FormGroup instance you passed into FormGroupDirective. Nested form arrays can come in handy when you have a group of form controls but you're not sure how many there will be.

Stable Class What it does Tracks the value and validity state of an array of FormControl instances. A FormArray aggregates the values of each child FormControl into an array. It calculates its status by reducing the statuses of its children. For example, if one of the controls in a FormArray is invalid, the entire array becomes invalid. FormArray is one of the three fundamental building blocks used to define forms in Angular, along with FormControl and FormGroup. How to use When instantiat

Validate user's form entries We can improve overall data quality by validating user input for accuracy and completeness. In this cookbook we show how to validate user input in the UI and display useful validation messages using first the template-driven forms and then the reactive forms approach. Learn more about these choices in the Forms chapter. Table of Contents Simple Template-Driven Forms Template-Driven Forms with validation messages in code Reactive Forms with validation in code C

Stable Interface Interface Overview interface Form { addControl(dir: NgControl) : void removeControl(dir: NgControl) : void getControl(dir: NgControl) : FormControl addFormGroup(dir: AbstractFormGroupDirective) : void removeFormGroup(dir: AbstractFormGroupDirective) : void getFormGroup(dir: AbstractFormGroupDirective) : FormGroup updateModel(dir: NgControl, value: any) : void } Interface Description An interface that FormGroupDirective and NgForm implement. Only used by the f

Experimental Class Class Overview class FnArg { constructor(value: any, type: Type<any>) value : any type : Type<any> } Class Description Constructor constructor(value: any, type: Type<any>) Class Details value : any type : Type<any> exported from @angular/platform-webworker/index, defined in @angular/platform-webworker/src/web_workers/shared/client_message_broker.ts

Experimental Function Class Export export flushMicrotasks() : void Flush any pending microtasks. exported from @angular/core/testing/index defined in @angular/core/testing/fake_async.ts

Experimental Function Class Export export fakeAsync(fn: Function) : args: any[]) => any Wraps a function to be executed in the fakeAsync zone: microtasks are manually executed by calling flushMicrotasks(), timers are synchronous, tick() simulates the asynchronous passage of time. If there are any pending timers at the end of the function, an exception will be thrown. Can be used to wrap inject() calls. Example describe('this test', () => { it('looks async but is synchronous', <any

Stable Interface What it does Configures the Injector to return a value by invoking a useFactory function. How to use function serviceFactory() { ... } const provider: FactoryProvider = {provide: 'someToken', useFactory: serviceFactory, deps: []}; Interface Overview interface FactoryProvider { provide : any useFactory : Function deps : any[] multi : boolean } Interface Description For more details, see the Dependency Injection Guide. Example const Location = new OpaqueToken('

Stable Interface What it does Represents options to configure the router. Interface Overview interface ExtraOptions { enableTracing : boolean useHash : boolean initialNavigation : boolean errorHandler : ErrorHandler } Interface Description Interface Details enableTracing : boolean Makes the router log all its internal events to the console. useHash : boolean Enables the location strategy that uses the URL fragment instead of the history API. initialNavigation : boolean Disabl