首页 > 解决方案 > 在 Angular 中的 CSS 转换后渲染 JS

问题描述

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

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

下面是我的代码。使用 jQuery 不是一种选择。

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

标签: javascripthtmlcssangularangular-ng-if

解决方案


简单地延迟this.desk = false超时:

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

这样,您的 CSS 转换将执行,然后,在 500 毫秒后,该变量将设置为 false。

此外,当然 jQuery 不是 Angular 应用程序中的一个选项 :)document.getElementById甚至不应该使用,因为它不是 angular-y,但我们可以说,如果它只是为了执行 CSS 转换,那没关系。


推荐阅读