Question

如果在登录容器加载之前没有逐行加载背景图像，如何加载背景图像？因为现在，容器在加载背景图像之前首先出现。我想在加载容器之前先加载图像。我试过插入自己的指令，但它对我不起作用。

这是我的控制者：

    app.controller('loginctrl', ['$scope', function ($scope) {


    }]);
MainApp.directive('imageonload', function () {
    return {
        restrict: "A",
        link: function (scope, element, attrs) {
            element.bind('load', function () {
                return true;
            });
        }
    }
});

这是我的css：

body {
    background: url("someurl");
    background-attachment: fixed;
    background-size: cover;
}

这是我的HTML：

 <!DOCTYPE html>
    <html>
    <head>

        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width" />

    </head>
    <body ng-app="app">
        <div ng-controller="loginctrl">
            <img ng-src="{{imageSrc}}" imageonload >
            <div id="container container-table">
                <div class="login">
                    <div class="col-md-6 col-md-offset-3">
                        <div id="loginModel">
                            <div class="modal-dialog">
                                <div class="modal-content">
                                    <div class="modal-header">


                                        <p>{{message}}</p>

                                    </div>


                                    <div class="modal-body" ng-init="getURL('@Model.URL')">

                                        <form style="padding: 0px 20px 0px 20px;">
                                            <div class="form-group" ng-class="{'has-error': userForm.username.$invalid }">
                                                <input type="text" class="form-control" name="username" ng-model="username" />
                                            </div>
                                            <div class="form-group" ng-class="{'has-error': userForm.password.$invalid }">
                                                <input type="password" class="form-control" name="password" placeholder="Password" ng-model="password" />
                                            </div>

                                        </form>
                                    </div>
                                    <div class="modal-footer">
                                        <div>
                                            <button class="btn btn-primary pull-right " ng-click="login()">Log In</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </body>
    </html>

Angular：如何在“容器”之前加载背景图像（没有线到线加载）？

0 个答案: