Using this guide
my html :
<button class="btn btn-default" (click)="showSuccess()">Show Success</button>
<button class="btn btn-danger" (click)="showError()">Show Error</button>
My ts :
import { AfterViewInit, Component, OnInit, ViewContainerRef } from '@angular/core';
import { ToastsManager } from 'ng2-toastr/ng2-toastr';
@Component({
selector: 'app-categoria',
templateUrl: '../../views/categoria/index.html',
styleUrls: ['../../styles/categoria.component.css'],
providers: [CategoriaService]
})
export class CategoriaIndexComponent implements OnInit{
constructor(
public toastr: ToastsManager,
public vcr: ViewContainerRef
){
this.toastr.setRootViewContainerRef(vcr);
}
ngOnInit(): void {}
showSuccess() {
this.toastr.success('You are awesome!', 'Success!');
}
showError() {
this.toastr.error('This is not good!', 'Oops!');
}
}
angular.jon
"styles": [
"src/styles.scss",
"node_modules/font-awesome/css/font-awesome.min.css",
"node_modules/font-awesome/scss/font-awesome.scss",
"node_modules/angular-bootstrap-md/scss/bootstrap/bootstrap.scss",
"node_modules/angular-bootstrap-md/scss/mdb-free.scss",
"node_modules/ng2-toastr/bundles/ng2-toastr.min.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.js",
"node_modules/ng2-toastr/bundles/ng2-toastr.min.js"
],
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MDBBootstrapModule } from 'angular-bootstrap-md';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ToastModule } from 'ng2-toastr/ng2-toastr';
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
MDBBootstrapModule.forRoot(),
CommonModule,
BrowserAnimationsModule,
ToastModule.forRoot()
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
The application does not load me and sends me this error by console: