title: show modal only after getting form submit response in angular 8
body: <p>I am calling a pop up when click on submit button in Angular 8 but it is showing immediately before getting response, so I need to show the modal only after getting the response. Can anybody help me to do this, please?</p>
  <p>Here is <strong>.html</strong></p>
  <pre><code>   &lt;div class=&quot;modal fade cust_modal save_qut_po&quot; id=&quot;sav-popup&quot; tabindex=&quot;-1&quot; role=&quot;dialog&quot; aria-labelledby=&quot;sav-qot-popup&quot; aria-hidden=&quot;true&quot;&gt;
  
        &lt;input type=&quot;submit&quot; class=&quot;upload-submit btn btn-primary&quot; value=&quot;{{'Save Quotation' | translate}}&quot; data-toggle=&quot;modal&quot; data-target=&quot;#sav-qot-popup&quot;  [disabled]=&quot;!Form.form.valid&quot; /&gt;
  </code></pre>
  <p>This is my <strong>.ts</strong> code.. want to show the pop up after getting <strong>605 response</strong></p>
  <pre><code>quotationNo: any;
    onSubmit(quotationForm: NgForm, saveQuotation) {
      try {
        
          if (quotationForm.form.valid) {
          this.submitted = false;
          if (this.quotationType)
            this.motorQuotation.quotationType = this.quotationType;
          this.motorQuotation.addDriver = this.driverList;
          this.motorQuotation.premiumDetails = this.premiumDetail;
  
          //var formData = new FormData();
          //formData.append('motorQuotation', JSON.stringify(this.motorQuotation));
  
  
          var formData = this.getFormValue();
          this.ruleExecutionResult = this.executeRule();
          if (!this.ruleExecutionResult) {
            formData.append(&quot;actionName&quot;, &quot;NEW&quot;);
            this.quotationCalculation();
          }
          else {
            formData.append(&quot;actionName&quot;, &quot;APPROVAL&quot;);
          }
          if (formData) {
           // this.spinner.show();
            this.apiCall.getResponseByPostWithoutToken(this._commonService.quotationFormSubmit, formData).then(
              result =&gt; {
                if (result.data) {
                  if (result.statusCode == 606) {
                    this.toastr.error(&quot;Error in commiting the data.&quot;);
                  }
                  if (result.statusCode == 605 &amp;&amp; this.ruleExecutionResult) {
                    this.toastr.info(&quot;Quotation &quot; + result.data.responseMessage + &quot; send for underwriter approval.&quot;);
                    this.quotationUnderwriter = true;
                    this.quotationSuccess = false;
                    this.isShowPopup = false;
  
  
                  }
                  if (result.statusCode == 605 &amp;&amp; !this.ruleExecutionResult) {
                    this.toastr.success(&quot;Quotation no is: &quot; + result.data.responseMessage);
                    this.quotationNo = result.data.responseMessage;
                    this.quotationSuccess = true;
                    this.quotationUnderwriter = false;
                    this.sample = true;
                    this.ref.detectChanges();
                    this.isShowPopup = false;
                    // this.loginButton.getNativeElement().click();
                    
                  }
                }
                this.spinner.hide();
              });
           
          }
        }
        else {
          this.spinner.hide();
          this.submitted = true;
        }
  </code></pre>