Search code examples
angulartoastr

Use toastr with angular2

I'm using this node package link

Following the instructions the typescript compiler gets out of mind. I think the problem is the same described here but I cant find a workaround.

Any help?

Thanks a lot

Solution

  • This means that you can use directly the toastr object directly without having to import it like this: import * as toastr from '...';.

    That said to avoid compilation error, you need to include the corresponding typings:

    /// <reference path="./toaster.d.ts" />

    Here is the way to use Toastr in a component:

    /// <reference path="./toaster.d.ts" />

import {Component} from 'angular2/core';

@Component({
  selector: 'my-app', 
  template: `
    <div (click)="displayToastr()">Display Toastr</div>
  `
})
export class AppComponent {
  constructor() {
    toastr.options = { positionClass: 'toast-bottom-right' };
  }

  displayToastr() {
    toastr.info('message');
  }
}

    Here is the corresponding plunkr: https://plnkr.co/edit/wzdoisKBrZYTeSX8r7Nd?p=preview.