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显示预加载器 - 指令

回答

相关问题