如何在页面上隐藏空元素? Ruby on Rails

时间:2016-05-09 19:33:49

标签: ruby-on-rails ruby-on-rails-4

所以我正在学习RoR 我正在尝试构建简单的图像板

我遇到的问题是我的节目帖子页面上有回复评论,即使用户没有创建一个

<div id="comments">
    <%= render @post.comments %>
</div>

这是我用来呈现评论的内容

    <div id="post_wrapper">
      <%= image_tag comment.image.url(:medium) %>
      <h2 id="post-content-index" style="font-size: 20px;" ><%= simple_format(comment.body).gsub("\n", "<br>").html_safe %></h2>
      <h1 id="post-username-index"><%= comment.name %></h1>
    </div>

这是_comment.html.erb

#post_wrapper , #post{
  width: 100%;
  background-color: #fff;
  padding: 10px;
  margin-top: 20px;
  -webkit-box-shadow: 3px 3px 12px -6px rgba(0,0,0,0.75);
  -moz-box-shadow: 3px 3px 12px -6px rgba(0,0,0,0.75);
  box-shadow: 3px 3px 12px -6px rgba(0,0,0,0.75); 
}

这是评论的样式

我的问题:有没有办法隐藏`

<div id="comments">
    <%= render @post.comments %>
</div>`

当它为空时

它看起来像什么:

enter image description here

class PostsController < ApplicationController

def landing
    @post = Post.last
end
def index
    @posts = Post.all.order("posts.created_at desc")
    def new
        @post = Post.new
    end
end

def show
    @post = Post.find(params[:id])
end

def faq

end
def mod

end
def rules

end

def create
    @post = Post.new(post_params)

    if @post.save
        redirect_to @post
    else
        render 'new'
    end
end

def post_params
    params.require(:post).permit(:title, :username, :content, :image)
end

class CommentsController < ApplicationController
def create
    @post = Post.find(params[:post_id])
    @comment = @post.comments.create(params[:comment].permit(:name,:body, :image))

    redirect_to post_path(@post)
end

3 个答案:

答案 0 :(得分:0)

我不完全确定我理解这个问题,但让我接受一下。如果你想在没有注释的情况下隐藏那个div,请尝试将它包装在ruby if语句中(在.erb代码包含标记内),只有在post对象上有注释时才会显示该部分。

从您的示例中,不清楚评论是多对一关联还是其他什么,但此代码假定它是一个关联,即使在那里没有任何关联,它也是&#39 ;是[]。

<% if @post.comments.length > 0 %>
    <div id="comments">
        <%= render @post.comments %>
    </div>`
<% end %>

如果我误解了,请澄清,我会再试一次......

答案 1 :(得分:0)

这个答案中的一部分取决于你认为“空”的答案。评论。注释模型似乎具有名称,正文和图像属性。我将处理这个问题的方法是使用模型中的范围来指定什么&#39;清空?表示,然后在视图中调用范围。

首先是范围:

class Comment
  ...
  scope :not_empty, -> { has('name').has('body').has('image') }
  scope :has, ->(column) { where("#{column} IS NOT NULL") }
  ...
end

接下来的观点:

<%= render @post.comments.not_empty %>

以这种方式放置范围将允许您决定not_empty应该真正定义的内容。以上要求填写所有三个属性。如果您只需要body和image,那么您可以将not_empty定义为:

scope :not_empty, -> { has('body').has('image') }

请注意,这是一个AND请求,或者需要另一个范围:

scope :has_at_least_one_of, ->(props){ 
  where(props.map{|p| "#{p} IS NOT NULL" }.join(' OR ') 
}

并且会被称为:

scope :not_empty, -> { has_at_least_one_of(['body', 'image', 'name']) }

答案 2 :(得分:0)

所以我实际修好了它

我替换了

<%= render @post.comments %>

<%= render @post.comments.limit(250) %>