Ember，异步呈现嵌套的模型集合

Question

免责声明：非常擅长新手，所以也许我问的是太基本但我在网上找不到任何解释

我有一个父对象报告，其中包含图表对象的集合。

当我加载网址/api/reports/001/charts时，会向API请求报告001 ，然后是属于此报告的所有图表 ，然后一切都被渲染，然后......秒向页面显示给用户。

像这样：

我正在尝试提供更渐进的渲染：

1. 报告是从API
加载的
2. 使用带有 loading 微调器的图表元素向用户显示报告
3. 每个图表都会单独向API请求
4. 每个图表都会单独向用户显示

步骤3和4并行发生，每个图表。

这样的事情：



当然，我不希望任何人带着完整的解决方案来找我，我正在寻找更多的方向，或者可以找到一些可以找到灵感的链接。

Answer 1

我们在仪表板上做了类似的事情。在路线中，我们加载用户仪表板，其中包含小部件列表及其位置。然后在仪表板模板中，我们为每个小部件呈现组件，如下所示。

{{#each widgets as |widget|}}
  {{component widget.type widget}}
{{/each}}

然后，通过将小部件实例（具有它自己的自定义设置）传递给组件，我们可以获取相关数据并显示它。每个小部件也可以拥有它自己的＆＃34;微调器＆＃34;告诉用户它仍在加载。

如果我假设您的情况稍微简单一些，因为您只显示图表并且可能是某种类型的ID，您可以在不使用组件帮助程序并直接引用图表组件的情况下离开。

{{#each charts as |chart|}}
  {{report-chart chart.id}}
{{/each}}