I use ng-select on my site, but the dropdown list is placed behind the modal when the page first loads. However, if I reload the page, the list is placed correctly this time. I use Angular 8.

<ng-select #selectSociety notFoundText="Aucun résultat" [items]="allOptions !== undefined ? allOptions : (societiesObs | async)"
                                        [loading]="societiesLoading" loadingText='Chargement...'
                                        [minTermLength]="2" bindLabel="name" bindValue="id" placeholder="Société"
                                        typeToSearchText="Entrez au moins 2 caractères" [typeahead]="societiesInput"
                                        formControlName="society_id"
                                        class="society quotation edit-select">

                                        <ng-template ng-footer-tmp>
                                            <div class="create-new"
                                                (click)="createSociety()">
                                                Ajouter une entreprise
                                            </div>
                                        </ng-template>

                                        <ng-template ng-option-tmp let-item="item" let-index="index" let-search="searchTerm">
                                            {{item.name}}
                                        </ng-template>
</ng-select>

and css of the ng-select.

.ng-select-wrapper {
    margin-bottom: 0;
    position: relative;
}
.ng-select {
    padding-bottom: 0;
    margin-bottom: 1.25em;
    
    .ng-select-container {
        .ng-value-container {
            align-self: center;
        }
    }
    .ng-arrow-wrapper {
        .ng-arrow {
            border-width: 4px 4px 2.5px;
        }
    }
}

.ng-select.billing .ng-select-container {
    background-color: #f0f9fe;
    border: none;
}
.ng-select.quotation .ng-select-container {
    background-color: #f0f9fe;
    border: none;

    &:hover {
        background-color: #cbf0ff;
    }
}
.ng-dropdown-panel {
    z-index: 3000 !important;
    .ng-dropdown-footer {
        cursor: pointer;
        &:hover {
            background-color: #f0f9fe;
        }
    }
}

.ng-select.edit-select {
    .ng-option {
        i {
            display: none;
            &:hover {
                color: $secondary;
            }
        }
        &:hover {
            i {
                display: block;
            }
        }
    }

enter image description here

enter image description here

I do not know how to solve this problem.