EmberJS-如何重構嵌入式模型？

Question

注意 ：使用Ember Rails 0.18.2和ember-source 1.12.1

我繼承了具有奇怪功能的Ember應用程序。 我是Ember的新手，所以也許這很正常，但我覺得很奇怪。

有3種型號：

1. 父母
2. 游戲類
3. 評論

當家長查看游戲時，網址如下所示：

/<parent slug>/games/<game_id>

（該段僅僅是父級的唯一ID）。

在此url處有一個包含以下代碼的模板：

  {{#unless commentsOpen}}
  {{#link-to 'comments' class="Button easyButton"}}Chat with parents in your pod{{/link-to}}
  {{/unless}}

  {{outlet}}

單擊上面的按鈕，然后將URL更改為此：

/<parent slug>/games/<game_id>/comments

然后，該游戲的所有注釋都會出現。

我需要從視圖中刪除該按鈕，並為每個游戲自動顯示評論。

該API是Rails，我已經可以更改API端點以在請求游戲的同時返回所有Comment（作為嵌入式對象數組）。

但是，我應將{{outlet}}替換為什么？ 因為我的理解是，由於以下原因，{{outlet}}委托給了Comments模板：

App.CommentsRoute = Ember.Route.extend
  model: ->
    return this.store.find('comment', {
      game:   @modelFor('game').get('id')
      parent: @modelFor('parent').get('slug')
    }).then( (models) -> models.toArray() )

我相信我需要刪除該路線，並使Comment成為Game模型內的嵌入式對象。 然后，我是否只需將插座替換為以下內容：

{{#each comment in Game}}

<div class="commentItem">
  <div class="commentItem-author">{{comment.parent_name}}</div>
  <div class="commentItem-body">{{comment.body}}</div>
</div>

{{each}}

編輯

這是路由器：

App.Router.map(function() {
  this.route('index', {
    path: '/'
  });
  return this.resource('parent', {
    path: '/:parent_id'
  }, function() {
    this.resource('games', {
      path: '/games'
    });
    return this.resource('game', {
      path: '/game/:game_id'
    }, function() {
      return this.resource('comments', {
        path: '/comments'
      });
    });
  });
});

Answer 1

假設您擁有當前的應用，並且大概在某個地方有類似的游戲列表：

{{#each games as |game|}}
  <li>
    {{#link-to 'game' game}}
       {{game.title}}
    {{/link-to}}
  </li>
{{/each}}

您應該可以通過更改鏈接直接將帶有評論的內容路由到游戲，如下所示：

{{#link-to 'games.game.comments' game}}

這里是一個玩弄了詳細的解決方案

Answer 2

答案就是將評論嵌入游戲中。 那么視圖是這樣的：

{{#each comment in model.comments}}

<div class="commentItem">
    <div class="commentItem-author">{{comment.parent_name}}</div>
    <div class="commentItem-body">{{comment.body}}</div>
</div>

{{/each}}