Before opening an issue, please search for duplicates (opened and closed) https://github.com/valor-software/ngx-bootstrap/issues There's no need to open an issue here if you want to ask general question, use StackOverflow or Slack instead
Bug description:
Recently, I upgraded Angular from version 9 to version 15 and also synchronized ngx-bootstrap to version 10.3.0. After the upgrade, I noticed that when I use the bsModalService to consecutively display two components, the backdrop (overlay) doesn't appear for the second component. Upon examining my code, I found that the previous code was written as follows: bsModalService.show(AComponent). In the constructor of AComponent, I instantiated a private variable bsModalRef of type BsModalRef. Additionally, I imported InnerA in AComponent, and in the AComponent HTML file, I used <inner-a (onHide)="handleHide()">. In the constructor of InnerA, I also instantiated a private variable bsModalRef of type BsModalRef. At this point, when I trigger this.bsModalRef.hide() from InnerA, upon receiving the notification in AComponent, I trigger a message to display Component B. Now, if I call this.bsModalRef.hide() again in AComponent, it will close the backdrop for the upcoming Modal B, leaving only Component B without a backdrop.
After examining the source code, I found that in this scenario, the bsModalRef variable in AComponent is being used, and it closes the backdrop for Component B. The condition ModalCount === 1 in the source code leads to this issue. I believe this condition might not be reasonable in this case.
Before opening an issue, please search for duplicates (opened and closed) https://github.com/valor-software/ngx-bootstrap/issues There's no need to open an issue here if you want to ask general question, use StackOverflow or Slack instead
Bug description:
Recently, I upgraded Angular from version 9 to version 15 and also synchronized ngx-bootstrap to version 10.3.0. After the upgrade, I noticed that when I use the bsModalService to consecutively display two components, the backdrop (overlay) doesn't appear for the second component. Upon examining my code, I found that the previous code was written as follows: bsModalService.show(AComponent). In the constructor of AComponent, I instantiated a private variable bsModalRef of type BsModalRef. Additionally, I imported InnerA in AComponent, and in the AComponent HTML file, I used <inner-a (onHide)="handleHide()">. In the constructor of InnerA, I also instantiated a private variable bsModalRef of type BsModalRef. At this point, when I trigger this.bsModalRef.hide() from InnerA, upon receiving the notification in AComponent, I trigger a message to display Component B. Now, if I call this.bsModalRef.hide() again in AComponent, it will close the backdrop for the upcoming Modal B, leaving only Component B without a backdrop.
After examining the source code, I found that in this scenario, the bsModalRef variable in AComponent is being used, and it closes the backdrop for Component B. The condition ModalCount === 1 in the source code leads to this issue. I believe this condition might not be reasonable in this case.
https://github.com/rockclock/NgxBoostrap-BsModalService
Versions of ngx-bootstrap, Angular, and Bootstrap:
ngx-bootstrap: 10.3.0
Angular: ^15.2.9
Bootstrap: ^5
Build system: Angular CLI, System.js, webpack, starter seed:
Expected behavior
When Component B is displayed, the backdrop will not be closed.