ngx-back-button

@ngx-translate/multi-http-loader

A library for handling a proper angular back button capability

• Installation
• Usage

Installation

npm install ngx-back-button

Inside your app.module.ts file.

import { NgxBackButtonModule, NgxBackButtonService } from 'ngx-back-button'

  imports: [
    NgxBackButtonModule.forRoot(), // Default rootUrl === '/'

    // Or
    NgxBackButtonModule.forRoot({
      rootUrl: '/custom', // Or any custom root url
    }),
  ],
  providers: [
    {
      provide: APP_INITIALIZER,
      useFactory: () => () => null,
      deps: [NgxBackButtonService],
      multi: true,
    },
  ]

Usage

Wherever you plan to use the back button logic

import { NgxBackButtonModule } from 'ngx-back-button'

imports: [
  NgxBackButtonModule,
]

Then you can use it in two different way

Directive

Normal use

<button ngxBackButton>
  Back to login
</button>

With Fallback

<button ngxBackButton="/login">
  Back to login
</button>

Service

// foo.component.ts
import { NgxBackButtonService } from 'ngx-back-button'

// ...
 constructor(public ngxBackButtonService: NgxBackButtonService) {}

Normal use

<button (click)="ngxBackButtonService.back()">
  Back to login
</button>

With Fallback

<button (click)="ngxBackButtonService.back('/login')">
  Back to login
</button>

Authors and acknowledgment

• maintainer Raphaël Balet
• Inspired by Nils Mehlhirn