1

I have a service in my application that shows a Bootstrap dialog. The code is very simple at the moment:

async showConfirmation(message: string): Promise<boolean> {

    this.message(message);
    this.isPopupOpen(true);

    return false;
}

At the moment the dialog HTML look like this:

<div role="dialog" aria-hidden="true" class="modal fade" data-bind="modal: { show: isPopupOpen }">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" title="Close" aria-label="Close">&times;</button>
        <h4 class="modal-title">My Modal</h4>
      </div>

      <div class="modal-body" data-bind="text: message"></div>

      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal" data-bind="click: close">Cancel</button>
        <button type="button" class="btn btn-primary" data-dismiss="modal" data-bind="click: close">OK</button>
      </div>
    </div>
  </div>
</div>

The close handler in my view model is also very simple, like this:

close(data, event) {

    //console.debug(data);
    console.debug(event.target);

    this.isPopupOpen(false);
}

At the moment the showConfirmation function immediately returns a hard coded false whereas I want to wait for the users response and return that as the result of showConfirmation.

I'm not entirely sure of the best way to achieve this. How can I make this wait for the user in order to return the appropriate response?

Jammer
  • 9,969
  • 11
  • 68
  • 115
  • Possible duplicate of [resolving a promise with EventListener](https://stackoverflow.com/questions/35718645/resolving-a-promise-with-eventlistener) – Søren D. Ptæus Jun 14 '18 at 09:12
  • 1
    It's in the same ballpark but doesn't cover this situation when using TypeScript. I'm still struggling to figure out how to get this working, even with the content of the other answer. – Jammer Jun 14 '18 at 11:13

0 Answers0