Issue with ng-show and a-element rendering

ionic-v1
1

Hi!

I am working on an app that uses ionic but I have a two bugs that I haven’t been able to sort out:

  1. One is with ng-show - I usually hide objects until they have been fully loaded or something else happens. This works perfect in the browser or when emulating but when I run it on an iPhone it takes a while for the html-element to hide it self. Like this: https://www.youtube.com/watch?v=jUIVZucgkNM&feature=youtu.be

            <div ng-show="verifyNewAccountMessage">
            {{verifyNewAccountMessage}}
            <div class="socialLogin" style="margin-top: 60px;">
                <ul class="socialLogin-buttons">
                    <li>
                        <a href="#/login" class="socialLogin--login">
                            <i class="ion-locked"></i>
                            <span>Login</span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

  2. My second issue is that I have an a-element that is rendered twice on the phone but works perfectly when emulating. Like this: https://www.youtube.com/watch?v=S7HnkkejKj0&feature=youtu.be

    < a ng-href="#/app/users/{{chapter.author.id}}" >{{chapter.author.name}}< /a >

Any help would be super!

2

  1. Try ng-cloak: https://docs.angularjs.org/api/ng/directive/ngCloak

  2. Not seen the second issue I’m afraid.

3

Thanks! Will try that.

4
  1. Don’t seem to work but I agree that ng-cloak should solve it…
  2. I solved this one. It seems that since the image is loaded afterwards, it creates a “shadow” of the text inside the a href. Never seen anything like it but when I set a fixed height so that they text didn’t wait for the image to be placed it solved it.