Continue running upon result from modal dialog

The following code is for modal dialog component. I want it to act like "confirm". Running will proceed only after clicking 'yes' (return true) or 'no' (return false) in the dialog.

import { Component, OnInit } from '@angular/core';
import {SharedobjectService} from 'src/app/service/sharedobject.service';

@Component({
  selector: 'app-confirm-box',
  templateUrl: './confirm-box.component.html',
  styleUrls: ['./confirm-box.component.scss']
})
export class ConfirmBoxComponent implements OnInit {

  display: boolean = false;
  messageText: string;
  result : boolean;

  constructor(private sharedObject: SharedobjectService) { 
    this.sharedObject.confirmBox = this;
  }

  /********************************************************************/
  showDialog(msg : string) : Promise<boolean> {
    return new Promise((resolve, reject) => {
      this.display = true;
    
      resolve (true);
    });
  }
  /********************************************************************/
  public onApprove () 
  {
    this.result = true;
  }

  /********************************************************************/
  public onCancel () 
  {
    this.result = false;
  }

  /********************************************************************/
  ngOnInit() {
    console.log ('ConfirmBoxComponent ngOnInit');
  }

}

<p-dialog modal='true' [(visible)]="display">
    <div class="p-grid p-dir-col">
        <label>{{ messageText }}</label>
        <br/>
        <div class="p-grid p-align-center p-nogutter">
            <button class="btn btn--primary col1" (click)="onApprove()">Yes</button>
            <button class="btn btn--primary col1" ngbAutofocus (click)="onCancel();">No</button>
        </div>
    </div>
</p-dialog>

In the parent component:

//Do something ...
let resp : boolean = await this.showDialog ('Hello');
//Continue ... 
if (resp==true)  //User clicked 'yes'
{
   
}

Currently I do not know how 'OnApprove' will cause the modal dialog to close with resp=true.

Try a subject called result, then emit the new subject value when any of the buttons are pressed. We can subscribe to the subject inside the promise. We use take(1) so that the subscription ends on the first emissions, else it will continue running.

import { Component, OnInit } from '@angular/core';
import {SharedobjectService} from 'src/app/service/sharedobject.service';

@Component({
  selector: 'app-confirm-box',
  templateUrl: './confirm-box.component.html',
  styleUrls: ['./confirm-box.component.scss']
})
export class ConfirmBoxComponent implements OnInit {

  display: boolean = false;
  messageText: string;
  result: Subject<boolean> = new Subject<boolean>();

  constructor(private sharedObject: SharedobjectService) { 
    this.sharedObject.confirmBox = this;
  }

  /********************************************************************/
  showDialog(msg : string) : Promise<boolean> {
    return new Promise((resolve, reject) => {
      this.display = true;
      this.result.pipe(take(1)).subscribe((_result: boolean) => {    // <- changed here!
        resolve(_result);                                       // <- changed here!
      });                                                       // <- changed here!
    });
  }
  /********************************************************************/
  public onApprove () 
  {
    this.result.next(true);             // <- changed here!
  }

  /********************************************************************/
  public onCancel () 
  {
    this.result.next(false);            // <- changed here!
  }

  /********************************************************************/
  ngOnInit() {
    console.log ('ConfirmBoxComponent ngOnInit');
  }

}

You can also simplify the code even further using firstValueFrom to convert the observable stream to a promise.

  showDialog(msg : string) : Promise<boolean> {
    return firstValueFrom(this.result.pipe(take(1)));
  }