2

我正在开发我的第一个重要的 Ember.js 应用程序，并且遇到了一些障碍。在使用 ember-data 遇到太多的显示停止错误后，我决定使用 Ember.Object 推出我自己的模型（至少现在 - ember-data 看起来真的很棒，很快就会真的）。

我的基本模型结构是：

  • 相册（具有相册特定的属性，并引用图像集合）
  • 图像（图像模型的 ArrayProxy 集合，它跟踪集合级别的属性，如“currentImage”和“nextImage”）
  • 图片

我的模板中有一个{{#linkTo}} 助手，它应该允许用户单击集合中的下一个图像，如下所示：

<button>
    {{#linkTo image controllers.images.nextImage}}
        Next Image
    {{/linkTo}}
</button>

此模板具有 的上下文AlbumController，其中needs: ["images"]. controllers.images.nextImage是一个计算属性，它计算出当前显示图像的 ID，然后使用它来查找ArrayProxy 集合Image中下一个模型的模型。Images

我的问题是这样的：

页面加载后，我收到一条错误消息Uncaught Error: assertion failed: Cannot call get with 'id' on an undefined object.

我假设这是因为{{#linkTo}}帮助程序试图id从 的返回中获取属性controllers.image.nextImage，这是一个依赖于Images从服务器加载的集合的计算属性。这种异步行为是在幕后通过 Promise 处理的，但{{#linkTo}}帮助程序似乎需要在页面加载后立即返回一个有效的上下文。

我的问题是：

  • 有没有其他人不得不处理这种情况，他们不使用 ember-data 并且不得不使用{{#linkTo}}具有不能立即可用的计算属性的助手？
  • 任何人都可以建议不与 Ember 的做事方式对抗的解决方法吗？

我的一些想法是：

  • 使计算属性返回一个虚拟上下文，在加载后以某种方式被替换为有效模型
  • 使用{{#action}}助手而不是{{#linkTo}}

我编写了一个 JSBin 示例，该示例大部分代码完整，除了我无法操纵哈希 URL 来触发嵌套路由，因此我必须在应用程序模板中执行所有操作。

4

0 回答 0