How can I implement Toastr notifications in Angular routing?

How can I implement Toastr notifications in Angular routing?

Toastr notifications can be integrated into Angular routing by using Angular's Router events. You can subscribe to these events and trigger Toastr notifications based on route changes.

Can you show me a code example for that?

Sure! First, install Toastr using npm. Then, in your component, subscribe to the Router events like this:

import { Component } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { ToastrService } from 'ngx-toastr';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
})
export class AppComponent {
  constructor(private router: Router, private toastr: ToastrService) {
    this.router.events.subscribe(event => {
      if (event instanceof NavigationEnd) {
        this.toastr.success('Navigated to ' + event.url);
      }
    });
  }
}

This will show a success notification every time you navigate to a new route.

What if I want to customize the Toastr notifications?

You can customize Toastr notifications by passing options to the success method. For example:

this.toastr.success('Message', 'Title', {
  timeOut: 3000,
  progressBar: true,
  closeButton: true
});