angularjs – 在ng-include元素可用之前,如何隐藏页面的显示？

发布时间：2020-12-17 07:17:34 所属栏目：安全来源：网络整理

导读：我使用以下代码块： section id="content" div class="block-border" div data-ng-controller="AdminGridContentController" ng-include src="'/Content/app/admin/partials/grid-content-base.html'"/ng-include ng-include src="'/Content/app/admin/parti

我使用以下代码块：

<section id="content">
    <div class="block-border">
        <div data-ng-controller="AdminGridContentController">
            <ng-include src="'/Content/app/admin/partials/grid-content-base.html'"></ng-include>
            <ng-include src="'/Content/app/admin/partials/table-content.html'"></ng-include>
            <ng-include src="'/Content/app/admin/partials/modal-content.html'"></ng-include>
        </div>
    </div>
</section>

这样可以工作但是当它首先显示它时会显示一个“块边框”,在我的例子中是一个阴影边框.然后在短时间内显示内部内容.

有没有办法让它成为外部< DIV>直到内部包含准备好后才显示？

你应该试试ngCloak：

The ngCloak directive is used to prevent the Angular html template from being briefly displayed by the browser in its raw (uncompiled) form while your application is loading. Use this directive to avoid the undesirable flicker effect caused by the html template display.

http://docs.angularjs.org/api/ng.directive:ngCloak

所以…在你的情况下：

<section id="content">
    <div class="block-border">
        <div data-ng-controller="AdminGridContentController" ng-cloak>
            <ng-include src="'/Content/app/admin/partials/grid-content-base.html'"></ng-include>
            <ng-include src="'/Content/app/admin/partials/table-content.html'"></ng-include>
            <ng-include src="'/Content/app/admin/partials/modal-content.html'"></ng-include>
        </div>
    </div>
</section>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!