Asynchronous 余烬js，在后台加载时显示微调器

当我的页面中有东西正在加载时，EmberJS有没有办法在某处显示加载模板

例如，我有一个有很多歌曲艺术家的页面，每个艺术家都有很多歌曲。我加载了艺术家的页面，很好，但在后台我加载了每个人的歌曲信息我只需要在某个地方安装一个加载微调器，它告诉我站点正在加载某些内容（例如，Chrome Developer Tools的“网络”选项卡中有一些待处理的内容…）

---

如何以如此优雅的方式做到这一点？

您可以观察

Ember.PROMISEPROXYMIXIN的isPending属性，如下所示：

{{#if artist.songs.isPending}}
  loading...
{{/if}}

据我所知（并且基于对API文档的快速阅读），Ember并没有提供实现这一点的内置方法。除非我错了，否则这意味着您需要自己实现请求状态跟踪

您可以在Ember的适配器层中执行此操作（例如，在
app/adapters/application.js
中添加代码），但最简单的解决方案可能是直接使用jQuery。您可以使用以下几个API：


，指示未完成请求的数量
及

我建议您创建一个跟踪此状态的控件，然后您可以将其插入需要基于此信息呈现模板的任何控制器或组件中。您的服务可能看起来像：

import Ember from 'ember';

export default Ember.Service.extend({

  init() {
    this._super(...arguments);
    const invalidateRequestInProgress = () => {
      this.notifyPropertyChange('dummyProperty');
    }

    $(document).ajaxStart(invalidateRequestInProgress);
    $(document).ajaxStop(invalidateRequestInProgress);
  },

  requestInProgress: Ember.computed('dummyProperty', function() {
    return Ember.$.active !== 0;
  }),

});

我还没有测试过这段代码，所以我不确定它在实践中是否有效：）
我不明白，你能解释一下吗？如果我需要在应用程序状态下加载？每次加载整个应用程序中的某些内容时都会出现的内容？您可以在与应用程序模板相同的根级别创建加载模板。但是，
isPending
改变了，不是吗？如果我正在加载artists.songs，则在应用程序路径的根级别显示什么？这取决于您试图实现的目标。如果在路由器转换到另一个路由时需要加载模板，则可以创建应用程序加载模板，但如果希望在加载模型时显示加载模板，则可以观察
isPending
或任何传递模型状态的mixin属性。我正在尝试你建议的方法，效果很好。但你能更好地解释这段代码的含义吗？具体地说，我会理解，
notifyPropertyChange
是必要的吗？使用
Ember.computed
是性能证明吗<代码>返回余烬。$.active！==0;具体是什么？我们有好的表现吗？由于ajax调用服务器时没有加载，因此我们必须求助于这些手动方法，那么究竟是什么加载了Ember（）的默认加载？（1）
notifyPropertyChange
告诉Ember，任何依赖于
'dummyProperty'
的计算属性都需要重新计算。这是缓存失效。（2） 使用Ember.computed可以检查模板中的
requestInProgress
。（3） 
Ember.$.active！==0;与
$相同。活动！==0;，除了使用Ember的jQuery命名空间副本之外——以防页面上定义了多个$s。有关
$.active
的含义，请查看我答案中的链接。（4）您链接到的文章中的“加载子状态”仅在等待从路由返回的承诺时才处于活动状态。Ember无法了解您所做的任意AJAX调用。上一次--我意识到将
notifyPropertyChange
与计算属性一起使用可能会让新手感到困惑。我相信这是最好的样式，因为它很懒，功能更强大，但是您也可以通过将
invalidateRequestInProgress
定义为
（）=>{this.set（'requestInProgress'，Ember.$.active！==0）；}
（这是急切的）来编写它。