[英]Hide and show footer with footer message In angularjs
I am trying to create an angular app in Intel XDK, I have 3 page scripts In index.html and have 3 separate footers.what I need is when I run each page the footer and footer message will show and hide every 5 seconds 我正在尝试在Intel XDK中创建一个角度应用程序,在index.html中有3个页面脚本,并且有3个单独的页脚。我需要的是当我运行每个页面时,每5秒显示和隐藏页脚和页脚消息
app.js app.js
app.controller('main', function ($scope,$interval,$ionicModal,localStorageService,$http,$q,$templateCache) {
$scope.showFooter =true;
$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;
}
}
$interval(function() {
if($scope.showFooter)
{
$scope.showFooter =false;
}
else{
$scope.showFooter =true;
}
},5000);
});
index.html index.html
I have 3 pages in index.html and 3 pages have separate 3 footers like 我在index.html中有3页,其中3页有单独的3页脚,例如
<div class="bar bar-footer bar-balanced" style="background-color:#444444;">
<div class="title">{{footer_message}}</div>
</div>
I tried the example, you need to add ng-show to show and hide the footer on data change. 我尝试了该示例,您需要添加ng-show以显示和隐藏数据更改时的页脚。
var app = angular.module("app",[]);
app.controller('main', function ($scope,$interval) {
$scope.showFooter =true;
$scope.footer_message ='Powered By';
$interval(function() {
if($scope.showFooter)
{
$scope.showFooter =false;
console.log($scope.showFooter);
}
else{
$scope.showFooter =true;
console.log($scope.showFooter);
}
},5000);
});
change the showFooter value based on the requirement. 根据要求更改showFooter值。
<div class="bar bar-footer bar-balanced" style="background-color:#444444;" ng-controller="main" ng-show="showFooter">
<div class="title">{{footer_message}}</div>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.