user3396923
user3396923

Reputation: 13

ionic ng-show working in browser but not on android/ios

i'm facing an annoying issue that i'm not able to solve, this code works perfectly in the browser but not on the android/ios devices:

<ion-view style="" title="Dettaglio">
<ion-content class="has-header" padding="true">
    <div style="" class="list card">
        <div class="item item-divider" ng-show="conditions">{{conditions.nome}} {{conditions.cognome}}</div>
        <div class="item item-divider" ng-hide="conditions">Errore!!</div>
        <div class="item item-body">
            <div style="" ng-show="conditions">
                <p>
                   Residuo: {{conditions.residuo}}
                </p>
            </div>
            <div style="" ng-hide="conditions">
                <p>
                   Utente non registrato o codice fiscale errato
                </p>
            </div>
        </div>
    </div>
    <div style="display: inline-block; width: 300px; height: 17px;" class="spacer"></div>
    <div style="" class="list card" ng-show="conditions">
        <div class="item item-divider">Note</div>
        <div class="item item-body">
            <div style="">
                <p>
                    {{conditions.note}}
                </p>
            </div>
        </div>
    </div>
</ion-content>

While testing the app in the Windows browser the ng-hide/ng-show work as intended hiding or showing the divs, but once i get the app on the android/ios devices each div is being displayed no matter what. i'm kinda new to angular/ionic but i can't understand why the ng-show directive is working in the browser but not on the devices.

Thanks in advance

Upvotes: 1

Views: 1275

Answers (2)

Andy Ballard
Andy Ballard

Reputation: 451

I had this problem in both the browser and my Android phone. It was caused by a recent upgrade in Cordova's security, and the need for a better "Content-Security-Policy".

I fixed it by adding to this line in index.html:

<meta http-equiv="Content-Security-Policy" content="default-src...

I added in:

'unsafe-inline' 'unsafe-eval'

Upvotes: 1

Jamie Mason
Jamie Mason

Reputation: 4196

I had a similar problem.

I fixed my case by inspecting the computed styles of the [ng-hide=""] element in Safari DevTools (running against the iOS simulator) to find that the .ng-hide { display: none!important } rule was not being created.

My workaround has been to add that rule to my own stylesheet.

Upvotes: 0

Related Questions