devyumao / angular2-busy

Show busy/loading indicators on any promise, or on any Observable's subscription.
http://devyumao.github.io/angular2-busy/demo/asset/
MIT License
314 stars 102 forks source link

Backdrop disable the entire screen instead of just the div #43

Open DavidOs55 opened 7 years ago

DavidOs55 commented 7 years ago

Hi, The backdrop and the indicator are displaying on the entire screen instead of the just the div that include the [ngBusy] property. The div display a table and I want that the indicator apply just on this table - like the demo . But the backdrop and the indicator are displaying on the entire screen. The div: <div class='table-responsive' [ngBusy]="{busy: busy, message: 'Loading...', backdrop: true, minDuration: 5000}" >

image

Thanks, David

DavidOs55 commented 7 years ago

Here is the div for the table : ![image](https://cloud.githubusercontent.com/assets/20335174/24200474/d9754478-0f15-11e7-947c-7fb396d55952.png)

gustavofrancoporto commented 7 years ago

Hi! I'm also facing this issue. I'd like to block just part of my screen and not it entirely. How can I achieve that?

Thanks, Gustavo.

devyumao commented 7 years ago

Hi, @DavidOs55 , @gustavofrancoporto , have you tried this? https://github.com/devyumao/angular2-busy#the-indicators-position-is-not-inside-the-ngbusy-container

gustavofrancoporto commented 7 years ago

Hi @devyumao. Yes I tried this but it didn`t work.

Sanjay-Confidosoft commented 7 years ago

I am having same issue, and found following:

Following working (i.e. adding style to parent div tag work):

<div style="position: relative; left: 10px; top: 10px;"> <div [ngBusy]="busy"> .... </div> </div>

Following not working:

<div [ngBusy]="busy" style="position: relative; left: 10px; top: 10px;"> -- </div>

gustavofrancoporto commented 7 years ago

Sorry, I might have done something wrong. It's working when there is a parent div with position relative.

Sleeper9 commented 7 years ago

I can confirm that the parent trick is working, thanks!