angularjs - Is there a way to hide the header and footer of an ion-view dynamically? -


i'm writing canvas app , canvas resides in main view. on orientation change, i'd hide header , footer.

i can't use new view, because wipe out canvas element (or @ least hide it), , i'd have re-run bunch of graphics initialization code. instead, resize canvas match horizontal phone dimensions.

so, when phone horizontal need hide header , footer of view. ideas?

edit can hide footer ng-show. same not true of header, i'm still stuck on.

here copy of view:

<ion-view title="my title">     <ion-nav-buttons side="right">         <button menu-toggle="right" class="button button-icon icon ion-navicon"></button>     </ion-nav-buttons>     <ion-content class="has-header has-footer" id="testcanvas" overflow-scroll="true" on-scroll="scroll()">     </ion-content>     <ion-footer-bar align-title="left" class="bar-assertive" style="padding-bottom: 60px;">         <div class="button-bar">             <button class="button icon-left ion-ios7-cloud-upload-outline" ng-click="go('save')">save</button>             <button class="button icon-left ion-ios7-folder-outline" ng-click="go('load')">load</button>             <button class="button icon-left ion-ios7-play-outline" ng-click="play()">play</button>         </div>     </ion-footer-bar> </ion-view> 

so, adding following attribute ion-view hide bar, , removing class "has-header" ion-content move content upwards.

<ion-view hide-nav-bar="true"></ion-view> 

however, doesn't can dynamically. i.e.:

<ion-view hide-nav-bar="{{hide}}"></ion-view> 

...doesn't work. i'd welcome thoughts on how make dynamic.

*i answered question removing footer bar in edit


Comments

Popular posts from this blog

1111. appearing after print sequence - php -

java - WARN : org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/board/] in DispatcherServlet with name 'appServlet' -

Ruby on Rails, ActiveRecord, Postgres, UTF-8 and ASCII-8BIT encodings -