javascript - 在 Ember.js 中访问父路由模型

Question

我正在尝试编写一个需要访问其父模型的路由。我使用 this.modelFor()，但是当我这样做时，父模型没有完全加载，所以它的所有属性都包含 null。

这是路由器，有两个动态段:

MGames.Router.map(function () {
    this.resource('games', function () {
        this.resource ('game', {path: '/:game_id'}, function () {
            this.resource('board', {path: '/boards/:board_id'});
        });
    });
});

这是我的 GameRoute，完美运行:

MGames.GameRoute = Ember.Route.extend ({
    model: function (params) {
        return MGames.Game.find(params.game_id);
    }
});

最后这是子路由，它需要访问 Game 模型，这就是我写的。但无论我做什么，console.log() 总是打印 null。如果我检查 game 变量，isLoad 属性始终为空:

MGames.BoardRoute = Ember.Route.extend ({
    model: function (params) {
        var game = this.modelFor ('game');
        console.log (game.get("id"));
        return MGames.Board.find(game.get("id"), params.board_id);
    }
});

我是不是做错了什么，或者(正如我怀疑的那样)我遗漏了一些 Ember 概念？

Answer 1

这部分代码看起来不错。您的假设是正确的，嵌套路由应该通过 modelFor 获取父级的模型。

我怀疑您的查找方法是错误的来源。我看了你的previous question ，并且我假设此处使用相同的 Game.find(?)

问题与 Promises 有关。 Ember 的路由器理解 model 钩子(Hook)的异步特性。但它依赖于你返回一个 Promise 来完成它的工作。目前您正在使用 jQuery promise，但会立即返回处于未初始化状态的 game 对象。查询从服务器加载，但假定 model() Hook 在此之前已解析。

您想直接从您的model 钩子(Hook)返回 jQuery Promise + 在第一个 then 中进行解析并将其作为结果返回.

这是您修改后的 Game.find。相同的原则适用于其他发现者。

find: function (game, board) {
  url = [MGames.GAMES_API_URL];
  url.push ('games');
  url.push (game);
  url.push ('boards');
  url.push (board);
  url = url.join('/');

  return $.getJSON(url)
    .then(function(response) {
      var game = MGames.Game.create({isLoaded: false});
      game.setProperties(response);
      game.set('isLoaded', true);

      return game;
    });
}

请注意，游戏对象按原样返回。 Ember 理解当 promise 被解析时(通过返回 promise 以外的任何东西)，该结果是 model() 钩子(Hook)的模型。此 game 对象是现在可在嵌套路由的 modelFor 中使用的模型。