Skip to content

Determine the trigger of the current page (either an imperative, backward or forward navigation).

License

Notifications You must be signed in to change notification settings

TheJLifeX/ngx-navigation-trigger

Repository files navigation

NgxNavigationTrigger

NPM NPM downloads

NgxNavigationTrigger allows you to know if the current page was trigged by either an 'imperative', 'backward' or 'forward' navigation.

Installation

npm install ngx-navigation-trigger --save

Usage

Step 01: Import the NgxNavigationTriggerModule to your module.

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

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

// Import NgxNavigationTriggerModule
import { NgxNavigationTriggerModule } from 'ngx-navigation-trigger';

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    NgxNavigationTriggerModule // Import NgxNavigationTriggerModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Step 02: Use the NavigationTriggerService in your component, directive or service file. For example:

app.component.ts

import { Component, OnInit } from '@angular/core';
import { NavigationTriggerService } from 'ngx-navigation-trigger';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {

  constructor(private navigationTriggerService: NavigationTriggerService) { }

  ngOnInit(): void {
    this.navigationTriggerService.eventUrlChanged.subscribe((value) => {
      const currentPageNavigationTrigger = value;
      console.log({ currentPageNavigationTrigger });
    });
  }
}

Documentation

NavigationTriggerService class

class NavigationTriggerService {
    /**
     * Emit the `NavigationTrigger` of the the current page.
     */
    eventUrlChanged: Observable<NavigationTrigger>;
}

NavigationTrigger enumeration

enum NavigationTrigger {
  IMPERATIVE = 'imperative',
  BACKWARD = 'backward',
  FORWARD = 'forward'
}

Known issue:

  • Does not support/work (to differenciate 'backward' or 'forward') when user right-clicks on browser back- or forward button and then clicks on an item.
    • PS: Pull requests to fix it are welcome.

License

MIT

About

Determine the trigger of the current page (either an imperative, backward or forward navigation).

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published