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; 
}