角度5动画:在“slideUp”之前设置“overlay:hidden”

我有一个触发器:

export const slideInOutTrigger = trigger('slideInOut', [
    state('true', style({
        height: '0',
        opacity: '0',
        overflow: 'hidden'
    })),
    state('false', style({
        height: '*',
        opacity: '1',
        overflow: 'hidden'
    })),
    transition('true => false, 1 => 0', animate('300ms linear')),
    transition('false => true, 0 => 1', animate('300ms linear'))
]);

它用于reqular Div:

<button (click)="collapsed = !collapsed">Trigger</button>
<div [@slideInOut]="collapsed">
    // other content
    <ng-select>..</ng-select> // <-CUSTOM SELECTBOX
</div>

一切正常,动画流畅。 向上滑动时,Div的内容必须不可见,因此 “覆盖:隐藏” 使用(否则看起来很奇怪)。

与Div内容冲突:

“覆盖:隐藏” 妨碍自定义选择框完全显示。

对

当到达Div的底部边缘时,选择框的选项将被剪切。

我的问题: 我想

• 设置“覆盖:'隐藏'”属性 临时和之前 Div向上滑动。
• 滑下完成后,属性应为 再次显示“覆盖:'可见'”。

感谢您的帮助!