Experimental Class Class Overview class MessageBus { initChannel(channel: string, runInZone?: boolean) : void attachToZone(zone: NgZone) : void from(channel: string) : EventEmitter<any> to(channel: string) : EventEmitter<any> } Class Description Message Bus is a low level API used to communicate between the UI and the background. Communication is based on a channel abstraction. Messages published in a given channel to one MessageBusSink are received on the same channel

Experimental Class Class Overview class ServiceMessageBrokerFactory { createMessageBroker(channel: string, runInZone?: boolean) : ServiceMessageBroker } Class Description Class Details createMessageBroker(channel: string, runInZone?: boolean) : ServiceMessageBroker Initializes the given channel and attaches a new ServiceMessageBroker to it. exported from @angular/platform-webworker/index, defined in @angular/platform-webworker/src/web_workers/shared/service_message_broker.ts

Stable Interface What it does Indicates that a class can implement to be a guard deciding if a children can be loaded. How to use class UserToken {} class Permissions { canLoadChildren(user: UserToken, id: string): boolean { return true; } } @Injectable() class CanLoadTeamSection implements CanLoad { constructor(private permissions: Permissions, private currentUser: UserToken) {} canLoad(route: Route( route: Route ): Observable<boolean>|Promise<boolean>|bool

Stable Interface What it does Represents the state of the router. How to use @Component({templateUrl:'template.html'}) class MyComponent { constructor(router: Router) { const state: RouterState = router.routerState; const root: ActivatedRoute = state.root; const child = root.firstChild; const id: Observable<string> = child.params.map(p => p.id); //... } } Interface Overview interface RouterState { snapshot : RouterStateSnapshot toString() : string }

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; } }

Stable Interface What it does Represents the extra options used during navigation. Interface Overview interface NavigationExtras { relativeTo : ActivatedRoute queryParams : Params fragment : string preserveQueryParams : boolean preserveFragment : boolean skipLocationChange : boolean replaceUrl : boolean } Interface Description Interface Details relativeTo : ActivatedRoute Enables relative navigation from the current ActivatedRoute. Configuration: [{ path: 'parent', co

We create a reusable service to manage our hero data calls Services The Tour of Heroes is evolving and we anticipate adding more components in the near future. Multiple components will need access to hero data and we don't want to copy and paste the same code over and over. Instead, we'll create a single reusable data service and learn to inject it in the components that need it. Refactoring data access to a separate service keeps the component lean and focused on supporting the view. It also m

Experimental Class Class Overview class HammerGestureConfig { events : string[] overrides : {[key: string]: Object} buildHammer(element: HTMLElement) : HammerInstance } Class Description Annotations @Injectable() Class Details events : string[] overrides : {[key: string]: Object} buildHammer(element: HTMLElement) : HammerInstance exported from @angular/platform-browser/index, defined in @angular/platform-browser/src/dom/events/hammer_gestures.ts

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

Stable Type-alias What it does Represents the resolved data associated with a particular route. See Routes for more details. Interface Overview interface ResolveData { } Interface Description exported from @angular/router/index, defined in @angular/router/src/config.ts