Question

我的启动画面显示应用程序启动时间为3秒

＆＃13;

<script>
    var body = document.getElementsByTagName('body')[0];

    setTimeout(function () {
        body.setAttribute('ng-app', 'app');
        angular.bootstrap(body, ['ng', 'app']);
    }, 3000);
</script>

＆＃13;

我在ng-cloak上有一个风格的div

<div class="splash img-responsive" ng-cloak="">
<div id="imageContainer">

</div>

我的飞溅的CSS是

＆＃13;

.splash {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /*filter: alpha(opacity=60);*/
    /*opacity: 0.6;*/
    background-image: url(../images/img.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    display: none;
}

＆＃13;

我只需要在角度应用启动时启动启动画面，但这会显示在每个页面刷新/重新加载。如何避免这种情况并仅在应用启动时显示启动画面。

Answer 1

您可以使用自己的方法仅在您需要时显示启动画面

删除允许启动闪屏的JS代码，您需要做的就是在前台显示要显示的图像（通过html），隐藏整个索引页面。 3秒后，您可以将该图像设置为display=none;，然后完成操作。

此逻辑允许您任意决定何时显示启动图像以及何时隐藏它或何时不显示它。

Answer 2

最简单地解决了这个问题！在我的控制器中编写了这段代码

 $scope.showDiv = true;
        $scope.hide = function () {
            $scope.showDiv = false;
            $timeout(function () {
                $scope.showDiv = true;
            }, 3000);
        }

所以现在我想在应用程序启动时以及在2-3秒显示登录框之后启动闪屏

 <div class="login-page">
    <div class="form-page" ng-init=hide() ng-show="showDiv"></div></div>

能够显示启动画面3秒并显示登录框

每次刷新时都会出现闪屏

2 个答案: