Stable Interface Interface Overview interface SafeUrl { } Interface Description Marker interface for a value that's safe to use as a URL linking to a document. exported from @angular/platform-browser/index, defined in @angular/platform-browser/src/security/dom_sanitization_service.ts

Learn how to apply CSS styles to components. Angular 2 applications are styled with regular CSS. That means we can apply everything we know about CSS stylesheets, selectors, rules, and media queries to our Angular applications directly. On top of this, Angular has the ability to bundle component styles with our components enabling a more modular design than regular stylesheets. In this chapter we learn how to load and apply these component styles. Table Of Contents Using Component Styles Specia

Stable Interface Interface Overview interface ModuleWithProviders { ngModule : Type<any> providers : Provider[] } Interface Description A wrapper around a module that also includes the providers. Interface Details ngModule : Type<any> providers : Provider[] exported from @angular/core/index, defined in @angular/core/src/metadata/ng_module.ts

Stable Const Variable Export export platformBrowser exported from @angular/platform-browser/index defined in @angular/platform-browser/src/browser.ts

Stable Class What it does Lifecycle hook that is called when any data-bound property of a directive changes. How to use . @Component({selector: 'my-cmp', template: `...`}) class MyComponent implements OnChanges { @Input() prop: number; ngOnChanges(changes: SimpleChanges) { // changes.prop contains the old and the new value... } } Class Overview class OnChanges { ngOnChanges(changes: SimpleChanges) : void } Class Description ngOnChanges is called right after the data-bou

Stable Interface What it does Represents the parsed URL. How to use @Component({templateUrl:'template.html'}) class MyComponent { constructor(router: Router) { const tree: UrlTree = router.parseUrl('/team/33/(user/victor//support:help)?debug=true#fragment'); const f = tree.fragment; // return 'fragment' const q = tree.queryParams; // returns {debug: 'true'} const g: UrlSegmentGroup = tree.root.children[PRIMARY_OUTLET]; const s: UrlSegment[] = g.segments; // returns 2

Stable Class Class Overview class Compiler { compileModuleSync(moduleType: Type<T>) : NgModuleFactory<T> compileModuleAsync(moduleType: Type<T>) : Promise<NgModuleFactory<T>> compileModuleAndAllComponentsSync(moduleType: Type<T>) : ModuleWithComponentFactories<T> compileModuleAndAllComponentsAsync(moduleType: Type<T>) : Promise<ModuleWithComponentFactories<T>> clearCache() : void clearCacheFor(type: Type<any>) }

Experimental Class Class Overview class XHRBackend { constructor(_browserXHR: BrowserXhr, _baseResponseOptions: ResponseOptions, _xsrfStrategy: XSRFStrategy) createConnection(request: Request) : XHRConnection } Class Description Creates XHRConnection instances. This class would typically not be used by end users, but could be overridden if a different backend implementation should be used, such as in a node backend. Example import {Http, MyNodeBackend, HTTP_PROVIDERS, BaseRequest

Stable Interface Interface Overview interface TrackByFn { } Interface Description An optional function passed into NgFor that defines how to track items in an iterable (e.g. by index or id) exported from @angular/core/index, defined in @angular/core/src/change_detection/differs/iterable_differs.ts

Stable Directive What it does Creates a top-level FormGroup instance and binds it to a form to track aggregate form value and validation status. How to use As soon as you import the FormsModule, this directive becomes active by default on all <form> tags. You don't need to add a special selector. You can export the directive into a local template variable using ngForm as the key (ex: #myForm="ngForm"). This is optional, but useful. Many properties from the underlying FormGroup instan