Hello World in 60 Seconds
Implement a super-simple <hello-world> custom element using an Angular component
written in TypeScript.
The Angular 2 with TypeScript Tutorial
Learn Angular 2 with TypeScript.
This tutorial includes examples of components, template syntax, property binding, event binding, bootstrapping and more.
Angular 2 with TypeScript Configuration
Configure Angular 2 and TypeScript to download dependencies from node modules or a CDN,
and to compile the TypeScript during development or in the browser at runtime.
Inline templates with template literals (using back-ticks) and external templates with absolute and relative paths.
Use template expressions in double curly braces to read data from the component class and template reference
variables. Covers the safe navigation operator, HTML sanitizing for security and the ngNonBindable
Use template expressions to bind to DOM properties such as hidden and title on
standard HTML elements such as div and span.
See how event bindings listen for DOM events such as click and keypress on
standard HTML elements such as button and input.
Combine the square brackets of property binding and the parentheses of event binding
to create two-way binding with ngModel.
Bind to HTML <input> fields such as
text, textarea, checkbox, radio
and select (drop-down list).
See how to use the following built-in directives with Angular 2 and TypeScript:
ngIf, ngSwitch, ngFor, ngClass
Component Input Outputbeta
Use property binding and the @Input decorator to pass data into a component,
and @Output and EventEmitter to pass data out and bind to an event.
Routing and Navigation
Angular 2 Router Example
Use the Angular 2 router to navigate between components when the user clicks a link.
We take a look at routerLink, routerLinkActive, <router-outlet> and more.
Nested Child Routes
An example of how child routes and nested <router-outlet>
directives allow navigation between multiple views when a user clicks a link in a sub-menu.