离子设备浏览器的区别

Question

I have my Ionic app all set up, however, it doesn't function like in the browser...for example, the background picture doesn't load. Does anyone know why?

Everything, including the API that app communicates with, is stored locally

Here is the view :

<ion-view title="Login" id="page2" hide-back-button="true" hide-nav-bar="true">
    <ion-content overflow-scroll="false" padding="true"
                 style="background: url('../img/loginBackground.jpg') no-repeat center;background-size:cover;">
        <form class="list">

            <style scoped>
                .inputCustom{
                    background-color: rgba(255,255,255,0.8);
                }

                .imgBack{
                    display: block;
                    margin-left: auto;
                    margin-right: auto;
                    overflow: visible;
                    min-width: 60vw;
                    max-height: 60vw;
                    max-width: 60vw;
                }
            </style>


            <img src="../img/logo.gif" class="imgBack">

            <div class="spacer" style="height: 60px;"></div>

            <ion-list>
                <label class="item item-input inputCustom">
                    <span class="input-label">E-mail</span>
                    <input type="email" placeholder="" ng-model="user.email">
                </label>
                <label class="item item-input inputCustom">
                    <span class="input-label">Lozinka</span>
                    <input type="password" placeholder="" ng-model="user.password">
                </label>

                <div class="animated flash" ng-show="validationBool"
                     style="text-align: center; padding-top: 5px; color: indianred">{{validationError}}
                </div>

            </ion-list>
            <div class="spacer" style="height: 40px;"></div>
            <a ng-click="signIn()" id="login-button1" class="button button-positive  button-block">Prijavi se</a>
            <a ui-sref="signup" id="login-button2" class="button button-positive  button-block button-clear">Nemaš račun? Registriraj se</a>
        </form>
    </ion-content>
</ion-view>

Answer 1

what I understand here is that you getting problem in showing up images in ionic. So here's the solution. Problem in your code is here

background: url('../img/loginBackground.jpg')

You haven't gave a proper url for your image.This must be like this.

background: url('/img/loginBackground.jpg')

Note: No dots and your image would be in "www/img".
Same for the img tag .

EDIT:
try this

.scroll-content {
background:url(/img/loginBackground.jpg) no-repeat center;
background-size: cover;

and remove style bavckground from ionic content.

Answer 2

I found out that the preceding slash was causing the problem. The correct path is

<ion-content overflow-scroll="false" padding="true"
                 style="background: url(img/loginBackground.jpg) no-repeat center;background-size:cover;">

And for logo:

<img src="img/logo.gif" class="imgBack">