使用$timeout(）隐藏特定间隔后的页脚和页脚消息

Hide footer and footer message after particular interval using $timeout()

本文关键字：消息 timeout 隐藏 使用      更新时间：2023-09-26

我正在尝试使用英特尔XDK创建一个有角度的应用程序。在这里，当我运行索引页面时，我们可以看到页脚消息。我需要的是页脚和页脚消息将在5秒钟后使用timeout（）隐藏。

但是我下面的代码不起作用。

index.html

 <div class="bar bar-footer bar-balanced" style="background-color:#444444;">
            <div class="title">{{footer_message}}</div>
        </div>

app.js

     app.controller('main', function ($scope,$interval,$timeout,$ionicModal,localStorageService,$http,$q,$templateCache) {
        $scope.footer_message ='Powered By';
        $scope.checkConnection=function() {
                    var networkState = navigator.connection.type;
                    if(networkState == Connection.NONE){
                        $scope.footer_message = "No Network Connection";
                        return false;
                    }
                    else{
                        $scope.footer_message = "Powered by";
                        return true;
                    }
                }

        $scope.showFooter=function(){
                $timeout(function () {
                    $scope.footer_message = null;
            }, 5000);
           }
        $scope.showFooter();
}

I have created one example for you check this plunkr
http://plnkr.co/edit/PLTgJ2JraNOHAwNKk7iY?p=preview

为什么不给页脚一个Id，然后在超时中执行("#footerId").hide()

还希望您在控制器中添加$timeout依赖项

如下更正，

<div class="bar bar-footer bar-balanced" ng-if="footer_message != 'null'" style="background-color:#444444;">
            <div class="title">{{footer_message}}</div>
        </div>

尝试对页脚div 使用ng隐藏

<div ng-hide="footer_message==null" class="bar bar-footer bar-balanced" style="background-color:#444444;">
   <div class="title">{{footer_message}}</div>
</div>

代码一切正常。。。我尝试了$timeoutJs报价

angular.module('ExampleApp', [])
    .controller('DemoController', function ($scope, $http, $q,$timeout) {
       $timeout(function(){
       $scope.footer_message=null;
       },5000);
    });

编辑1:Js报价

这是检查互联网连接的工作

 if(navigator.onLine){
          $scope.footer_message='success';
          }
          else{
          $scope.footer_message=' no network ';
          }
相关文章：