javascript - 在Ember.js中实现 Accordion 式 View

在一个玩具应用程序中，我有一个“帖子”模板，其中显示了所有帖子标题。当您单击每个标题时，我不想直接进入“显示”视图，而是直接内联扩展该帖子的其余内容。

我考虑过让postRoute重用postsRoute并设置一个标志，然后将其在车把模板中进行检查以吐出其余的帖子内容。

什么是首选的“灰烬式”方法，该方法将使资源的单一视图与索引视图在正确的位置内嵌显示？

最佳答案

我建议在itemController上定义一个PostsController，它可以对单个post对象采取措施。
然后，在模板中定义在itemController上切换属性的操作（例如toggleBody）。您可以使用此属性显示或隐藏每个帖子的正文：

App.PostsController = Ember.ArrayController.extend
  itemController: 'post'

App.PostController = Ember.ObjectController.extend
  showBody: no
  actions:
    toggleBody: ->
      @toggleProperty('showBody')
      return false

<script type="text/x-handlebars" data-template-name="posts">
<ul>
  {{#each}}
    <li>{{title}} <span {{action toggleBody}} class='label'>Toggle</span>
    {{#if showBody}}
      <div>{{body}}</div>
    {{/if}}
    </li>
  {{/each}}
</ul>
</script>

另请参见this jsFiddle以获取有效的演示。

关于javascript - 在Ember.js中实现 Accordion 式 View ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21947828/