在Ember.js中实现一个手风琴式视图

亚历克斯·麦克普

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

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

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

Bazzel

我会建议定义itemControllerPostsController,可以采取个别文章对象的动作。然后,在模板中定义在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>

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

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在Ember.js中实现手风琴式视图

来自分类Dev

单击另一个手风琴中的链接时,手风琴图像不会更改

来自分类Dev

单击另一个手风琴中的链接时,手风琴图像不会更改

来自分类Dev

链接到另一个手风琴中的一个手风琴中的内容

来自分类Dev

将div手风琴视为一个

来自分类Dev

排序一个手风琴表(jQuery)

来自分类Dev

创建一个状态保存的手风琴

来自分类Dev

仅打开一个手风琴面板vue.js / bootstrap vue

来自分类Dev

Foundation 6多重手风琴,如何一次只扩展一个手风琴

来自分类Dev

打开/激活手风琴中的第一个标签

来自分类Dev

手风琴中的第一个孩子打开

来自分类Dev

我如何在material-ui中获取手风琴手风琴元素的最后一个子项,角度为8

来自分类Dev

打开另一个手风琴后自动关闭手风琴

来自分类Dev

如何在引导程序中为手风琴添加一个正号或负号?关闭手风琴时显示加号,打开手风琴时减号

来自分类Dev

链接到手风琴中的另一个选项卡,嵌入式链接将不起作用

来自分类Dev

链接到手风琴中的另一个选项卡,嵌入式链接将不起作用

来自分类Dev

ember-cli:创建一个可以渲染视图的助手吗?

来自分类Dev

单击以关闭另一个手风琴组时如何打开一个手风琴组?

来自分类Dev

Ember.js ember-plupload拖放

来自分类Dev

Ember.js ember-plupload拖放

来自分类Dev

jQuery手风琴| 在页面加载和活动状态混乱中打开第一个元素

来自分类Dev

在Ember-CLI中升级Ember

来自分类Dev

Ember:访问Ember组件中的数据存储

来自分类Dev

Liferay中的手风琴/折叠式导航

来自分类Dev

如何一次只扩展一个手风琴标签?

来自分类Dev

Twitter Bootstrap 3-当链接单击另一个手风琴时自动扩展手风琴

来自分类Dev

如何在打开另一个手风琴文本之前关闭手风琴元素

来自分类Dev

Twitter Bootstrap 3-当链接单击另一个手风琴时自动展开手风琴

来自分类Dev

如何在打开另一个手风琴文本之前关闭手风琴元素

Related 相关文章

  1. 1

    在Ember.js中实现手风琴式视图

  2. 2

    单击另一个手风琴中的链接时,手风琴图像不会更改

  3. 3

    单击另一个手风琴中的链接时,手风琴图像不会更改

  4. 4

    链接到另一个手风琴中的一个手风琴中的内容

  5. 5

    将div手风琴视为一个

  6. 6

    排序一个手风琴表(jQuery)

  7. 7

    创建一个状态保存的手风琴

  8. 8

    仅打开一个手风琴面板vue.js / bootstrap vue

  9. 9

    Foundation 6多重手风琴,如何一次只扩展一个手风琴

  10. 10

    打开/激活手风琴中的第一个标签

  11. 11

    手风琴中的第一个孩子打开

  12. 12

    我如何在material-ui中获取手风琴手风琴元素的最后一个子项,角度为8

  13. 13

    打开另一个手风琴后自动关闭手风琴

  14. 14

    如何在引导程序中为手风琴添加一个正号或负号?关闭手风琴时显示加号,打开手风琴时减号

  15. 15

    链接到手风琴中的另一个选项卡,嵌入式链接将不起作用

  16. 16

    链接到手风琴中的另一个选项卡,嵌入式链接将不起作用

  17. 17

    ember-cli:创建一个可以渲染视图的助手吗?

  18. 18

    单击以关闭另一个手风琴组时如何打开一个手风琴组?

  19. 19

    Ember.js ember-plupload拖放

  20. 20

    Ember.js ember-plupload拖放

  21. 21

    jQuery手风琴| 在页面加载和活动状态混乱中打开第一个元素

  22. 22

    在Ember-CLI中升级Ember

  23. 23

    Ember:访问Ember组件中的数据存储

  24. 24

    Liferay中的手风琴/折叠式导航

  25. 25

    如何一次只扩展一个手风琴标签?

  26. 26

    Twitter Bootstrap 3-当链接单击另一个手风琴时自动扩展手风琴

  27. 27

    如何在打开另一个手风琴文本之前关闭手风琴元素

  28. 28

    Twitter Bootstrap 3-当链接单击另一个手风琴时自动展开手风琴

  29. 29

    如何在打开另一个手风琴文本之前关闭手风琴元素

热门标签

归档