渲染嵌套/线程注释答案

【问题标题】：Rendering nested/threaded comments渲染嵌套/线程注释
【发布时间】：2011-08-20 17:26:27
【问题描述】：

在SO post 之后，我尝试使用acts_as_tree rails 插件渲染缩进的cmets，但没有成功。

我认为问题在于这种方法（我不明白）：

def indented_render(num, *args)
  render(*args).gsub(/^/, "\t" * num)
end

这种方法可以替代什么？我的部分如下：

%div{:id => "comment_#{comment.id}"}
  = comment.body
  = render :partial => 'comments/comment', :collection => comment.children
  - unless comment.children.empty?
    = indented_render 1, :partial => 'comments/comment', :collection => comment.children

但是，没有任何行是缩进的。我究竟做错了什么？有没有更好的方法来渲染 cmets？

更新：这是生成的html：

<h1>Listing comments</h1>
<table>
  <tr>
    <td>
        <div id='comment_1'>
          (152) Facebook version of you: 400 friends. Real version of you: 4 friends
        <div id='comment_2'>
          (0) Well played.
            <div id='comment_3'>
              (0) I used to. Then I got married.
                <div id='comment_4'>
                  (17) math is hard
                    <div id='comment_5'>
                      (1) What's a math?
                        <div id='comment_6'>
                          (1) This made coke come out my nose.
                            <div id='comment_7'>
                              (2) So maybe I wasn't the best with fractions.
                            </div>
                            <div id='comment_8'>
                              (1) That sounds terribly painful. Please accept my apologies. Isn't it supposed to be going in your nose, not out?
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

【问题讨论】：

不，根本没有标签。我附上了我的 html 的样子。
我想我明白了。我有thread->comments（2 个不同的模型），我不确定如何以这种方式显示整个线程历史，所以我做了一个虚拟根注释并将其设为线程 cmets 的父级（thread->root_comment->comments）。有没有更好的方法来做到这一点？

标签： html ruby ruby-on-rails-3 methods partial-views

【解决方案1】：

我认为这些选项卡只是为了使生成的 HTML 更漂亮一些。看起来生成的 HTML 已正确嵌套以生成树状结构，您只需要一些 CSS。首先，您可能想要在评论包装器<div>s 上创建一个类，因此请更改：

%div{:id => "comment_#{comment.id}"}

到这里：

%div{:id => "comment_#{comment.id}", :class => 'comment'}

然后，在某个 CSS 中，试试这个：

.comment {
    margin-left: 20px;
}

这应该缩进嵌套的<div>s，让您从树形结构开始。

看起来您正在使用 HAML，而我的 HAML 不是那么好，但希望以上内容足够接近，可以纠正您的有用信息。

【讨论】：