Confirm Dialogue - luftsport/nlf-client GitHub Wiki

Confirm dialopgue

Nlf-client uses the ConfirmService which is based upon ng-bootstrap's NgbModal.

The confirmService is easy to add to existing logic and returns a promise.

Import and instantiate

import { ConfirmService } from 'app/services/confirm/confirm.service';

constructor(private confirmService: ConfirmService) {}

Confirm modal content

interface confirmMsg {
    title: string;
    message: string; // HTML allowed
    yes?: string;    // defaults 'Yes'
    no?: string;     // default 'No'
}

Using the service

Wrap the logic with confirmService and then handle the promise when it returns yes and then no.

public delete(item) {
    const confirmMsg = { title: 'Please confirm',
                         message: 'Are you sure you want to delete ' + item.name + ' ?',
                         yes: 'Delete',
                         no: 'Cancel'};
    this.confirmService.confirm(confirmMsg).then(
        () => { // Yes
            this.deleteItem(item);
        },
        () => { // No
            // Do nothing?
        }
    );
}