Ember.js：从集合中检索随机元素答案

【问题标题】：Ember.js: retrieve random element from a collectionEmber.js：从集合中检索随机元素
【发布时间】：2013-01-31 08:36:06
【问题描述】：

我有这样的路线：

App.RandomThingRoute = Ember.Route.extend({
  model: function() {
    return App.Thing.find("random");
  }
});

需要前往/things/random API 端点。

我在控制器中也有一个动作：

App.RandomThingController = Ember.ObjectController.extend({
  displayRandomThing: function() {
    return this.content.reload();
  }
});

在模板中重新加载随机的东西。

我刚开始使用 Ember.js（或任何 MVC 前端框架），我几乎没有疑问/问题：

首先：这是正确的做事方式吗 (this.content.reload())？
我的 API 端点接受 old_thing 参数，该参数允许获取与当前显示的不同的随机事物：/things/random?old_thing=Something。在 Ember.js 中实现这一点的最惯用/正确的方法是什么？如何将此old_thing 传递给find() 和reload()？我应该使用这里建议的视图：Preferred way to retrieve data from a template in EmberJS 吗？

我很难找到一些关于 ember-data 的文档（一切都感觉过时了）。

【问题讨论】：

标签： javascript ember.js

【解决方案1】：

1 - 我宁愿以这种方式在控制器中重新加载内容：

reloadContent: function(){
    this.set('content', App.Thing.find("random"));
}

2 - 如果您想将参数传递给您的 GET（假设您使用的是 RESTAdapter），您可以使用哈希传递它们。

App.Thing.find({old_thing: 'oldThing');

但这里有些“可疑”。 Model.find 需要一个 id 或一个哈希。你的“随机”感觉两者都不是。

我不知道您是否可以在指定 ID 时发送参数，因为您使用“随机”指定。这感觉有点不对，因为您已经指定要获取单个项目，但同时也发送散列以过滤项目。（这不是你的意图）

【讨论】：

我知道 Ember.js 不适合这样的任务（我不是在抱怨，只是陈述事实）......那你会怎么处理呢？

【解决方案2】：

我来寻找这个问题的答案并最终来到这里。我需要为我的模型找到一条随机记录，但不知道如何调用 store 的 find 方法。

查看 ember-data 源后，我发现将对象传递给 find 方法会将存储从 findById 切换到 findQuery。

这让我觉得为单个随机对象调用 find 的一种体面方法可能是：

App.Thing.find({random:true, old_thing: 'oldThing', limit:1});

这些将被转换为查询参数，然后您需要修改您的 API 'Thing' 端点以接受这些参数。

api/thing?random=true&old_thing=oldThing&limit=1

允许将随机标志和限制作为参数传入意味着您不必使用额外的路由来弄乱您的 API 来查找随机记录。

我不确定这是否是最惯用的方式，但这是我选择的方式。

编辑：

请注意，如果您像这样查询，您的 API 与 Ember Data 结合应该返回一个包含一个元素的数组。现在，由于调用是异步进行的，因此在调用“find”后不会立即定义元素，因此您必须添加一个观察者来在项目加载后更新控制器的内容。

类似这样的东西，在我的轨道控制器上：

, randomiseTrack: function(){
        var _this = this
        var currentTrackId = this.get('content.id')
        var loadingTrackList = App.Track.find({
            random:true, 
            current_track_id: currentTrackId, 
            limit: 1
        });
        loadingTrackList.addObserver("isLoaded", function(){
            _this.set('content', loadingTrackList.materializedObjectAt(0));
        });
}

【讨论】：