页面加载进度条实现的原理是什么

Question

页面加载的时候出现loading动画，然后loading动画消失，页面内容出来，我该怎么判断这一步呢

Answer 1

用ajax去请求，请求成功了把内容显示出来，把loading隐藏

Answer 2

页面先显示加载的loading图片，然后你获取你要加载的图片是否都加载完毕，再用onload将loading图片隐藏掉就可以

Answer 3

在线demogenerator-es6-angular。

看过之后可以用生成器，generator自己生成一个这样的项目，

里面关于你说的问题，的解决方案在js/index.js里：

require.ensure(['splash-screen/dist/splash.min.css', 'splash-screen'], function(require) {

    require('splash-screen/dist/splash.min.css').use();
    require('splash-screen').Splash.enable('circular');
});

require.ensure(['css/main.css', 'splash-screen', './main'], function(require) {

    require('css/main.css').use();

    var App = require('./main').default;
    (new App()).run();
});

销毁loading的核心在js/main.js里：

destroySplash() {
    var _this = this;
    Splash.destroy();
    require('splash-screen/dist/splash.min.css').unuse();
    setTimeout(function() {
        if (Splash.isRunning()) {
            _this.destroySplash();
        }
    }, 100);
}

我还有一篇关于这个工具的介绍：用ES6编写AngularJS程序是怎样一种体验