2

在我们的 Ember 应用程序中加载“页面”时，我们无法获得某种形式的视觉指示。

尝试了 gif 方法和Spin JS。两者都失败了，因为它们非常滞后并且只有在所有 Ember 对象都加载后才完全加载。与此问题类似的问题。

其他人在面向公众的构建中使用什么方法？

编辑：这是应用程序第一次加载的时候。初始负载足够长，需要某种形式的视觉指示。

4

2 回答 2

3

您可以使用加载指示器向文档添加叠加层。当您通过 CSS 添加它时，它会在 Ember 初始化之前加载。ember 初始化后，您可以删除覆盖。

下面是我如何实现它的示例：

HTML：

<html>
  <head> ... load dependencies ... </head>
  <body class="loading"> ... handlebars templates ... </body>
</html>

CSS：

body.loading:after {
  content: '';
  background: rgba(255,255,255,.3) url(images/loader.gif) 50% no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}

灰烬代码：

App.ApplicationView = Ember.View.extend({
    removeLoader: function() {
        $('body').removeClass('loading');
    }.on('didInsertElement')
});

这种方式在 Ember 初始化之前会显示一个加载指示器，但是当 Ember 完成初始化时，加载器会被删除。

于 2013-02-26T10:07:35.577 回答
1

您可以为此使用jQuery ajax 回调：

$(document).ajaxStart(function(){ console.log("ajax started")})
$(document).ajaxStop(function(){ console.log("ajax stopped")})

这适用于所有 ajax 请求。

于 2013-02-11T21:18:40.440 回答