Can't get ng-show/ng-hide to work in ion-header inside ion-modal-view


#1

I am using ng-show/ng-hide to switch between two different header titles. It works in the browser but does not work in android (4.1). I also tried using ng-switch, but the same net result. This is inside an ion-modal.

<ion-header-bar>
  <h1 class="title" >
    <span ng-hide="clipboardMsg">{{title()}}</span>
    <span ng-show="clipboardMsg" class="clipboard-msg">{{clipboardMsg}}</span>
  </h1>
  <button class="button button-clear button-primary" ng-click="close()">Close</button>
</ion-header-bar>

Will greatly appreciate help. Thanks.


#2

try ng-if directive instead of ng-hode/ng-switch, otherwise try run your up with crosswalk for more compatibility


#3

Thanks. I tried and that too does not work.

I was wondering if this has something to do with angular’s digest cycle. My modal scope is a child of root scope. When the user wants to copy an item to clipboard, I copy it and then try to give user a visual cue for 2000ms. (copy to clipboard works a-ok, no issues.) But the visual feedback works only in browser not on android. So what I did was add an {{clipboardMsg}} along the non-header items. That too works only in browser not in android.


#4

Really, is this forum this quiet?!!


#5

try to use bootstrap component for angularjs and then use resolve method for modal to pass data like title or what you want


#6

Just upgraded to latest ionic framework 1.1.0, works now.