모달 상자가 희미 해짐 모드 - ngx-modal (각도 2)

Question

here의 모달 상자를 사용하고 있습니다.

나는 트리거 할 때 항상 희미한 모드로 표시됩니다. 나는 그 뒤에있는 이유가 무엇인지 모릅니다.

중 하나가 나를 위해 정말 도움이 될 것입니다 문제가 무엇인지 알고있는 경우 : 여기

<button (click)="myModal.open()">open my modal</button> 
<modal #myModal style='z-index:999' > 
    <modal-header> 
     <h1>Modal header</h1> 
    </modal-header> 
    <modal-content> 
     Hello Modal! 
    </modal-content> 
    <modal-footer> 
     <button class="btn btn-primary" (click)="myModal.close()">close</button> 
    </modal-footer> 
</modal> 

은 이미지입니다.

Answer 1

나는 동일한 문제가 있으며 그 원인을 발견했지만 해결책을 찾지 못했습니다. 나는 너에게 똑같은 문제가 있다고 가정한다. 문제는 위치 속성입니다. 위치가 끈적 끈적으로 고정되어 있으면 어떤 이유로 든 사라집니다. 제 경우에는 그 구성 요소가 고정 된 위치에 있고 항상 바닥에 놓 이길 원합니다. 그래서 그것을 위에 올려 놓는 방법을 찾아야 만합니다. 문제는 여기에

.player{ 
    position: fixed; 
    bottom: 0; 
    height: 150px; 
    background-color: black; 
    width: 100%; 
} 

을 내 모달이있는 내 플레이어입니다

<div class="player"> 
    <my-player></my-player> 
</div> 

여기에 대응하는 스타일입니다. 이것은 관련 정보 만 붙여 넣은 구성 요소의 일부입니다.

<a id="lyrics" (click)="myLyricsModal.open(); $event.stopPropagation(); lyrics()" data-toggle="tooltip" title="Lyrics" class="control-button glyphicon glyphicon-align-center"></a>   
<modal class="mymodal" #myLyricsModal modalClass="modal-lg"> 
    <modal-header> 
     <h1>Lyrics for: {{lyricHeader}}</h1> 
    </modal-header> 
    <modal-content> 
     <pre class="lyric"> 
      {{lyric}} 
      </pre> 
    </modal-content> 
    <modal-footer> 
     <img class="pull-left" [src]="lyricImageUrl | safe"> 
     <button class="btn btn-primary" (click)="myLyricsModal.close()">close</button> 
    </modal-footer> 
</modal> 

그래서 예를 들어 절대에 I 세트 플레이어 수준의 위치는 모달은 페이드 위에 제대로 보여 주었다 될 경우하지만 내 플레이어 UI의 하단에 항상 고정되어 있지 않습니다. (저는 100vh를 사용합니다)

이렇게하면 사이트를 수정하는 방법을 찾는 데 도움이되는 경우 위치 변경이 도움이되는지 또는 어떤 요소의 Z- 색인을 수정해야하는지 알았습니까? 다른 일을하십시오.