Programming Steps: 222 Ionic-v1 Footer Toggle: Nightly

Friday, June 2, 2017

222 Ionic-v1 Footer Toggle: Nightly

Footer Toggle: Nightly
code example:

<html ng-app="ionicApp">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    
    <title>Toggle Footer</title>

<body ng-controller="AppCtrl">
    
  <ion-content padding="true" ng-class="{'has-footer': showFooter}">
    <button ng-click="toggleFooter()" class="button button-assertive">Toggle Footer</button>
    </ion-content>
  <ion-footer-bar class="bar-assertive" ng-if="showFooter">
</ion-footer-bar>
<script>
angular.module('ionicApp', ['ionic'])
.controller('AppCtrl', function($scope) {
  $scope.showFooter = true;
  $scope.toggleFooter = function() {
    console.log('Toggling footer');
    $scope.showFooter = !$scope.showFooter;
  }
})  
    </script>
  </body>
</html>

https://codepen.io/-kaik-/pen/GggagK/

201706,20170602