Angular Confirmation Popover

Overview

Angular Confirmation Popover is a simple Angular directive designed for Angular 15.0+ that displays a Bootstrap-styled confirmation popover when an element is clicked. This provides an easy way to enhance user interactions by prompting for confirmation before executing actions.

Features

• Bootstrap Styled Popover: Displays confirmation popover with Bootstrap styling.
• Simple Directive: Easy implementation as an Angular directive.
• Supports Angular 15.0+: Compatible with Angular version 15.0 and above.
• Custom Popover Styling: If not using Bootstrap, customized popover styles can be implemented.
• Auto-generated Documentation: Documentation is auto-generated via compodoc for reference.

Installation

1. Install through npm:

   npm install angular-confirmation-popover
   

2. Install Bootstrap (v3 or v4 supported) or implement custom popover styles.
3. Add the NgModule:

   import { ConfirmationPopoverModule } from 'angular-confirmation-popover';
   @NgModule({
     imports: [ConfirmationPopoverModule]
   })
   export class YourModule { }
   

4. Use the directive in your component’s HTML:

   <button mwlConfirmationPopover="Are you sure?" [placement]="'top'" (confirm)="confirmed()" (cancel)="canceled()">Delete</button>
   

Summary

Angular Confirmation Popover is a useful Angular directive that enhances user interactions by providing a Bootstrap-styled confirmation popover, ensuring that important actions are confirmed before execution. The flexibility of custom popover styling and easy installation make it a convenient choice for developers working with Angular applications.