Angular 6 - display component as modal dialog from a component.ts

I am attempting to display a modal confirmation popup after I perform a submit action from my component.

The onSubmit() method in my home.component.ts:

onSubmit() {
var response = new Response(1, this.name, this.phone, this.email,
this.optIn, this.responses);
this.questionsService.saveResponse(response).subscribe(
data => response = data)

// show popup confirmation dialog here

this.ngOnInit();
}


My confirmation-modal component: import { Component, Input } from '@angular/core';

import { NgbModal, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
selector: 'confirmation-modal',
templateUrl: './confirmation-modal.html'
})

export class ConfirmationModal {
modalRef;

constructor(private modalService: NgbModal) {
}

open(content) {
this.modalRef = this.modalService.open(content, { centered: true,
size: 'sm' });
}

onClose() {
this.modalRef.close();
}
}


My component-modal.html is a regular ng-bootstrap HTML template. So, the question is, how can I open the confirmation-modal dialog from the onSubmit() method? I realize I can use a service, but any examples?

Thanks.

Continue reading...