TypeScript configuration for Angular 2 developers TypeScript is a primary language for Angular application development. It is a dialect of JavaScript with design-time support for type-safety and tooling. Browsers can't execute TypeScript directly. Typescript must be "transpiled" into JavaScript using the tsc compiler, which requires some configuration. This page covers some aspects of TypeScript configuration and the TypeScript environment that are important to Angular developers, including det

Experimental Interface Interface Overview interface WtfScopeFn { } Interface Description A scope function for the Web Tracing Framework (WTF). exported from @angular/core/index, defined in @angular/core/src/profile/wtf_impl.ts

Convert Angular 2 TypeScript examples into ES5 JavaScript Everything that we can do in Angular 2 in TypeScript, we can also do in JavaScript. Translating from one language to the other is mostly a matter of changing the way we organize our code and the way we access Angular 2 APIs. Since TypeScript is a popular language option in Angular 2, many of the code examples you see on the Internet as well as on this site are written in TypeScript. This cookbook contains recipes for translating these ki

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

Recommended npm packages, and how to specify package dependencies Angular applications and Angular itself depend upon features and functionality provided by a variety of third-party packages. These packages are maintained and installed with the Node Package Manager (npm). Node.js and npm are essential to Angular 2 development. Get them now if they're not already installed on your machine. Verify that you are running node v4.x.x or higher and npm 3.x.x or higher by running the commands node -

Angular has a powerful template engine that lets us easily manipulate the DOM structure of our elements. One of the defining features of a single page application is its manipulation of the DOM tree. Instead of serving a whole new page every time a user navigates, whole sections of the DOM appear and disappear according to the application state. In this chapter we'll to look at how Angular manipulates the DOM and how we can do it ourselves in our own directives. In this chapter we will learn wh

Experimental Const Variable Export export AUTO_STYLE exported from @angular/core/index defined in @angular/core/src/animation/metadata.ts

Module Entry point for all public APIs of the platform-browser-dynamic package. platformWorkerAppDynamic defined in @angular/platform-webworker-dynamic/index.ts

Stable Class What it does Adds router directives and providers. How to use RouterModule can be imported multiple times: once per lazily-loaded bundle. Since the router deals with a global shared resource--location, we cannot have more than one router service active. That is why there are two ways to create the module: RouterModule.forRoot and RouterModule.forChild. forRoot creates a module that contains all the directives, the given routes, and the router service itself. forChild creates

Stable Directive What it does Binds an existing FormGroup to a DOM element. How to use This directive accepts an existing FormGroup instance. It will then use this FormGroup instance to match any child FormControl, FormGroup, and FormArray instances to child FormControlName, FormGroupName, and FormArrayName directives. Set value: You can set the form's initial value when instantiating the FormGroup, or you can set it programmatically later using the FormGroup's setValue or patchValue metho