在Angular中进行CSS转换后渲染JS

时间:2019-08-14 12:09:40

标签: javascript html css angular angular-ng-if

所以我有一个按钮,当单击onGoToAbout函数时会被调用。此函数将元素高度设置为0,还将desk布尔变量设置为false。该变量连接到元素*ngIf

我的问题是*ngIf是在CSS转换发生之前执行的。我在想需要一些延迟,但不知道如何实现!

下面是我的代码。不能使用jQuery。

onGoToAbout(event) {
 document.getElementById("slideshow").style.height = "0vh";
        this.desk = false;
    }

1 个答案:

答案 0 :(得分:2)

只需延迟this.desk = false即可超时:

setTimeout( () => { this.desk = false }, 500 )

这样,您的CSS过渡就会执行,然后在500毫秒后,变量将设置为false。

此外,当然jQuery不是Angular应用程序中的选项:) document.getElementById甚至不应该使用,因为它不是angular-y,但是如果仅完成CSS过渡的话就可以说,没关系。