1 import { Component, HostListener, OnInit, ViewChild } from '@angular/core'
3 import { ModalDirective } from 'ngx-bootstrap/modal'
5 import { ConfirmService } from './confirm.service'
8 selector: 'my-confirm',
9 templateUrl: './confirm.component.html',
10 styleUrls: [ './confirm.component.scss' ]
12 export class ConfirmComponent implements OnInit {
13 @ViewChild('confirmModal') confirmModal: ModalDirective
17 expectedInputValue = ''
21 confirmButtonText = ''
23 constructor (private confirmService: ConfirmService) {
28 this.confirmModal.config = {
33 this.confirmService.showConfirm.subscribe(
34 ({ title, message, expectedInputValue, inputLabel, confirmButtonText }) => {
36 this.message = message
38 this.inputLabel = inputLabel
39 this.expectedInputValue = expectedInputValue
41 this.confirmButtonText = confirmButtonText || 'Confirm'
48 @HostListener('keydown.enter')
50 this.confirmService.confirmResponse.next(true)
54 @HostListener('keydown.esc')
56 this.confirmService.confirmResponse.next(false)
60 isConfirmationDisabled () {
61 // No input validation
62 if (!this.inputLabel || !this.expectedInputValue) return false
64 return this.expectedInputValue !== this.inputValue
68 this.confirmModal.show()
72 this.confirmModal.hide()