ng-bootstrap模態動畫

Question

漸變類似乎不適用於ngb模式。

我看過試圖將自己的動畫應用到模態，但模態模板顯然是通過ng-bootstrap注入到模態對話中的，例如，我無法訪問模態對話。我只能訪問模板：

<template #content let-c="close" let-d="dismiss"> 
    <div class="modal-header card-header" style="border-radius: 10px;"> 
    <h4 class="modal-title">Contact Form</h4> 
</div> 
    <div class="modal-body"> </div> 
...etc 
</template> 

我需要將我的動畫應用到頂層對話框，否則就是模態動畫的位。如果我將它應用到模板，它會炸燬。

任何想法如何動畫整個模態？

Answer 1

不幸的是，ng-bootstraps模態中的動畫還不支持。 此外，我設法讓解決方法通過使用jQuery動畫：

open(content, config) { 
    this.ngbModal.open(content); 
    $('.modal-content').animate({ opacity: 1 }); 
    $('.modal-backdrop').animate({ opacity: 0.9 }); 

    } 

，並在根styles.css中，你還需要：

.modal-backdrop.show { 
    opacity: 0; 
    transition: 4s; 
} 

.modal-content { 
    opacity: 0; 
    transition: 0.15s; 
}