title: How to wait for HTTP Request Response + Confirm Dialogue PopUp + Angular 8
body: <p>I have a requirement where I want to show the confirm popup message before redirecting to other page, where I am taking input from the user weather he want to leave with unsaved changes or not. </p>
  
  <p><strong>What is happening!</strong></p>
  
  <p>On browser confirm dialogue box come first then get the HTTP-Request response which is not correct. </p>
  
  <p><strong>What should be!</strong></p>
  
  <p>I want the HTTP Response get first and if condition satisfied then pop up the confirm dialogue message. </p>
  
  <p>Here is the code sample I am using for my project. </p>
  
  <p><strong>service.ts</strong> file </p>
  
  <pre><code> async IsUnSavedRosterExistsTwo() {
      console.log('async method called');
      const url = this.util.getBaseURL() + apiURLs.IsUnSavedRosterExists;
      const rr =  await this.http.get&lt;boolean&gt;(url).toPromise();
      console.log(rr);
      return rr;
    }
  </code></pre>
  
  <p>I have tried all the possible solution like subscribe, promise , pipe and all but nothing is work here. </p>
  
  <p><strong>component.ts</strong> </p>
  
  <pre><code>canDeactivate() {
      this.saveDownloadButton = false;
      // const IsUnSavedRosterExists = this.rosterService.IsUnSavedRosterExists();
      const IsUnSavedRosterExists = this.rosterService.IsUnSavedRosterExistsTwo();
  
      debugger;
      if (IsUnSavedRosterExists) {
        console.log('executing the code');
        return confirm('You have unsaved Employee Data. Do you wish to proceed without saving?');
      } else {
        this.saveDownloadButton = false;
      }
      return this.saveDownloadButton;
    }
  </code></pre>
  
  <p><strong>In Short, I want to wait for http-request response to come first and then execute if condition satisfies then pop up the confirm dialog box else redirect to other page.</strong></p>
  
  <p>Do let me know if my question is not clear.</p>