# Usage with Angular 2 & TypeScript

Create `error_handler.ts`:

```TypeScript
import { ErrorHandler } from '@angular/core';
import AirbrakeClient from 'airbrake-js';

export class AirbrakeErrorHandler implements ErrorHandler {
  airbrake: AirbrakeClient;

  constructor() {
    this.airbrake = new AirbrakeClient({
      projectId: 1,
      projectKey: 'FIXME'
    });
  }

  handleError(error: any): void {
    this.airbrake.notify(error);
  }
}
```

Add `ErrorHandler` provider to your `AppModule`:

```TypeScript
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler } from '@angular/core';

import { AppComponent } from './app.component';
import { AirbrakeErrorHandler } from './error_handler';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [{provide: ErrorHandler, useClass: AirbrakeErrorHandler}],
  bootstrap: [AppComponent]
})
export class AppModule { }
```

### Usage with Angular 2 & TypeScript

### Create an error handler
The first step is to create an error handler with an `AirbrakeClient`
initialized with your `projectId` and `projectKey`. In this example the
handler will be in a file called `error_handler.ts`.

```ts
import { ErrorHandler } from '@angular/core';
import AirbrakeClient from 'airbrake-js';

export class AirbrakeErrorHandler implements ErrorHandler {
  airbrake: AirbrakeClient;

  constructor() {
    this.airbrake = new AirbrakeClient({
      projectId: 1,
      projectKey: 'FIXME'
    });
  }

  handleError(error: any): void {
    this.airbrake.notify(error);
  }
}
```

### Add the error handler to your `AppModule`

The last step is adding the `ErrorHandler` to your `AppModule`, then your app
will be ready to report errors to Airbrake.

```ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler } from '@angular/core';

import { AppComponent } from './app.component';
import { AirbrakeErrorHandler } from './error_handler';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [{provide: ErrorHandler, useClass: AirbrakeErrorHandler}],
  bootstrap: [AppComponent]
})
export class AppModule { }
```


Update the angular 2 doc
Update the angular 2 doc

I plan to pull this README.md into airbrake-docs so we only need to
manage the configuration for Angular 2 instructions in a single
location.

I updated the code blocks to use `ts` instead since the docs site does
not perform correct highlighting with `TypeScript` specified.

More details: https://github.com/airbrake/airbrake-docs/pull/232
