为应用程序路由创建加载子状态

Question

我正在尝试使用最近添加的new named substate options 为应用程序路由创建加载子状态，但由于某种原因，我无法让它工作。最初，我只是创建了一个简单的模板，loading.hbs，它会自动运行，但由于应用程序路由上的子状态问题，我的一些 UI 仍然可见。我现在想更正一下。

我尝试重命名模板并将其移动到以下位置：

/templates/application_loading.hbs 
/templates/application-loading.hbs
/templates/application/loading.hbs

但似乎没有一个工作。我不需要任何自定义路由行为，所以默认生成的路由应该做我，除非它需要它才能工作。有关此功能的文档似乎很少。我找到了jsbin for this feature，除非 ember-cli 有问题，否则我应该按照它正确地做。

感谢您的帮助。

DEBUG: -------------------------------
DEBUG: Ember      : 1.11.1
DEBUG: Ember Data : 1.0.0-beta.16.1
DEBUG: jQuery     : 1.11.2
DEBUG: -------------------------------

Answer 1

我相信loading.hbs 和error.hbs 是应用程序的加载和错误子状态。 Ember 不存在您的 application-loading.hbs，这就是它不起作用的原因。

至于额外的 UI 元素：我相信 application.hbs 的其余部分无论如何都会呈现，所以我唯一的建议是将所有这些元素嵌套更深一层。这听起来像是一场巨大的考验，但实际上并没有那么糟糕：

在router.js:

this.resource('whatever', {path: '/'} function() {
  // All your existing routes
});

然后将application.hbs 重命名为whatever.hbs 并将application.hbs 更改为仅包含{{outlet}}。这在实践中应该不会有任何其他改变，但它会阻止您的其余 UI 元素呈现，直到加载完成。

Answer 2

真的应该在添加赏金之前用谷歌搜索它。

显然，这个功能是broken。不过已经有fix，只是需要合并和发布。

Answer 3

看来你必须有一个 moduleBasedResolver

https://github.com/emberjs/ember.js/blob/06e41ad7ccd28558dd4e651aa070bc06f7757821/packages/ember-application/lib/system/application-instance.js#L153

https://github.com/emberjs/ember.js/blob/b80d66f71d75ad0db9022438ed58a41ac84f45f5/packages/ember-routing/lib/system/router.js#L79

当我在 ember-cli 应用程序中查看此值时，它是未定义的。这看起来很奇怪，因为 ember-cli 是基于 es6 模块的。

然后我发现这个https://github.com/emberjs/ember.js/issues/10756 看起来你可以添加一个路由应用程序加载或在moduleBasedResolver 中破解到注册表作为临时解决方案。

和

https://github.com/emberjs/ember.js/pull/10944 从长远来看应该可以解决这个问题。

您似乎已经找到了这个，当我写这个答案时它似乎没有加载。抱歉打扰了。