PRIMARY_OUTLET

Stable Const What it does Name of the primary outlet. Variable Export export PRIMARY_OUTLET exported from @angular/router/index defined in @angular/router/src/shared.ts

FormGroupName

Stable Directive What it does Syncs a nested FormGroup to a DOM element. How to use This directive can only be used with a parent FormGroupDirective (selector: [formGroup]). It accepts the string name of the nested FormGroup you want to link, and will look for a FormGroup registered with that name in the parent FormGroup instance you passed into FormGroupDirective. Nested form groups can come in handy when you want to validate a sub-group of a form separately from the rest or when you'd li

3. Displaying Data

Interpolation and other forms of property binding help us show app data in the UI. We typically display data in Angular by binding controls in an HTML template to properties of an Angular component. In this chapter, we'll create a component with a list of heroes. Each hero has a name. We'll display the list of hero names and conditionally show a message below the list. The final UI looks like this: Table Of Contents Showing component properties with interpolation Showing an array property wit

KeyValueChangeRecord

Stable Class Class Overview class KeyValueChangeRecord { constructor(key: any) previousValue : any currentValue : any key : any toString() : string } Class Description Constructor constructor(key: any) Class Details previousValue : any currentValue : any key : any toString() : string exported from @angular/core/index, defined in @angular/core/src/change_detection/differs/default_keyvalue_differ.ts

ChangeDetectorRef

Stable Class Class Overview class ChangeDetectorRef { markForCheck() : void detach() : void detectChanges() : void checkNoChanges() : void reattach() : void } Class Description Class Details markForCheck() : void Marks all ChangeDetectionStrategy ancestors as to be checked. (live demo) @Component({ selector: 'cmp', changeDetection: ChangeDetectionStrategy.OnPush, template: `Number of ticks: {{numberOfTicks}}` }) class Cmp { numberOfTicks = 0; constructor(ref: Chang

NgFor

Stable Directive Class Overview class NgFor { constructor(_viewContainer: ViewContainerRef, _template: TemplateRef<NgForRow>, _differs: IterableDiffers, _cdr: ChangeDetectorRef) ngForOf : any ngForTrackBy : TrackByFn ngForTemplate ngOnChanges(changes: SimpleChanges) : void ngDoCheck() } Selectors [ngFor][ngForOf] Class Description The NgFor directive instantiates a template once per item from an iterable. The context for each instantiated template inherits from t

Router

Stable Class What it does Provides the navigation and url manipulation capabilities. See Routes for more details and examples. Class Overview class Router { constructor(rootComponentType: Type<any>, urlSerializer: UrlSerializer, outletMap: RouterOutletMap, location: Location, injector: Injector, loader: NgModuleFactoryLoader, compiler: Compiler, config: Routes) errorHandler : ErrorHandler navigated : boolean config : Routes initialNavigation() : void setUpLocationCh

Browser support

Browser support and polyfills guide. Browser support Angular supports most recent browsers. This includes the following specific versions: Chrome Firefox Edge IE Safari iOS Android IE mobile latest latest 14 11 9 9 Marshmallow (6.0) 11 13 10 8 8 Lollipop(5.0, 5.1) 9 7 7 KitKat(4.4) Jelly Bean(4.1, 4.2, 4.3) Angular's continuous integration process runs unit tests of the framework on all of these browsers for every pull request, using SauceLabs and Browserstack. Polyfills Angul

RC4 to RC5 Migration

Migrate your RC4 app to RC5 in minutes. Angular Modules (NgModules) have landed in Angular RC5! Angular Modules, also known as NgModules, are the powerful new way to organize and bootstrap your Angular application. Read more in the "RC5 and NgModules" announcement. Learn the details of NgModule in the Angular Module chapter. The new @NgModule decorator gives you module-level components, directives, and pipes without the need to specify them repeatedly in every component of your application.

4. Multiple Components

We refactor the master/detail view into separate components Our app is growing. Use cases are flowing in for reusing components, passing data to components, and creating more reusable assets. Let's separate the heroes list from the hero details and make the details component reusable. Run the live example for this part. Where We Left Off Before we continue with our Tour of Heroes, let’s verify we have the following structure. If not, we’ll need to go back and follow the previous chapters. angu