samedi 8 juin 2019

Ng bootstrap modal is not poping up just after closing one modal popup in angular

Here is the problem,enter image description here

I want to just open popups successModal if(res != null || res != undefined) otherwise want to popups failureModal. But it pops up in background just after closing reserveModal.

Here is my code: Here is my code:-

this.locolService.sendActivityRequest(requestObject).subscribe((res)=>{
      console.log('response after sending request ', res.description);
      if(res != null || res != undefined){
        this.reserveModel.close();
        this.modalService.open(successModal);
      }
    }, error =>{
      this.errors = error.error.description;
      this.errors = this.errors.replace("User","You");
        console.log('error ', this.errors);
      this.reserveModel.close();
      this.modalService.open(failureModal);
    });
  }

Here is my component.html:-

<ng-template #requestSentModelSuccess let-c="close" let-d="dismiss">
  <div class="modal-header">
    <h4 class="modal-title" id="modal-basic-title">Hi there!</h4>
    <button type="button" class="close" aria-label="Close" (click)="d('Cross click')">
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
  <div class="modal-body">
    <p>Congrats! Your place has been reserved. A will of receipt will be sent on your email also<br /><br />Check My
      Account
      for your reservations</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-outline-dark" (click)="c('Save click')">Close</button>
  </div>
</ng-template>

  <!--MODAL-3-->
  <ng-template #requestSentModelFaliure let-c="close" let-d="dismiss">
    <div class="modal-header">
      <h5 class="modal-title text-uppercase" id="">Error</h5>
      <button type="button" class="close" (click)="d('Cross click')" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
      <p><br /><br />Check My
        Account
        for your reservations</p>

      <a type="button" (click)="onNewSearch(false)" class="btn btn-primary mybtngreen btn-lg text-uppercase">My
        Account</a>
      <a type="button" (click)="onMyAccount(false)" class="btn btn-outline-secondary btn-lg text-uppercase">New
        search</a>
      <div class="mt-2"></div>
      <div class="clearfix"></div>
    </div>
  </ng-template>

I have referenced: requestSentModelFaliure as failureModal and requestSentModelSuccess as successModal using NgbModalRef.




Aucun commentaire:

Enregistrer un commentaire