AngularJS顯示預加載器 - 指令

我想在網站加載時顯示預加載器。問題是，我的其他內容出現在preloader dom加載之前。預加載器在整個dom加載後出現。我希望預加載器在其他任何事情之前出現。這裏是我的指令：AngularJS顯示預加載器 - 指令

function() { 
     "use strict"; 
     angular.module("App").directive("preloader", ["$timeout", "$window", "$q", function(a, b, c, d, e, f, g) { 
      return { 
       restrict: "A", 
       templateUrl: "views/preloader.html", 
       replace: !0,   
      } 
     }]) 
    }.call(this),

& preloader.html

<div id="preloader"> 
    <div class='logo'> 

    </div> 
</div>

的index.html：提前

<body ng-app="App"> 

    <div preloader></div> 

    <main class="main" ui-view=""></main> 
</body>

謝謝，我感謝所有幫助和解決方案可以提供。

來源

2017-06-16 Karl B.

您可以直接將您的預加載器放在<main>HERE...</main>中，當視圖加載時它將被替換。

看看this plunker，您可以在加載視圖內容之前簡要地看到「Preloader ...」。

來源

2017-06-16 14:30:34 JeanJacques

我需要預加載整個頁面不僅爲

我有其他事情在網站上了。 –

然後，也許你可以看看[angular-page-loader]（https://www.npmjs.com/package/angular-page-loader），[這裏]（https://codekraft.it/demos/ angular-page-loader/example/default /＃/）是它的一個演示 – JeanJacques

你可以像這樣調用index.html標記的初始化函數body。

<body ng-app="App" ng-init="myInitFunction()"> 

<div preloader></div> 

<main class="main" ui-view=""></main>

而且在myInitFunction()編寫代碼來調用您的裝載機。

我希望這對你的作品

來源

2017-06-19 08:43:30

AngularJS顯示預加載器 - 指令

回答

相關問題