如何使用轨道上的红宝石以药丸形式显示某个类别的文章

时间:2016-01-25 06:30:07

标签: ruby-on-rails ruby categories

我正在尝试显示列出文章类别的药丸表,如果选择,将仅显示手风琴样式列表中该类别的文章。每篇文章都有多个类别。

我的模型如下:

class Article < ActiveRecord::Base
  belongs_to :user
  has_many :article_categories
  has_many :categories, through: :article_categories
  validates :title, presence: true, length: {minimum: 3, maximum: 50}
  validates :description, presence: true, length: {minimum: 10, maximum: 300}
  validates :user_id, presence: true
end

class Category < ActiveRecord::Base
  has_many :article_categories
  has_many :articles, through: :article_categories
  validates :name, presence: true, length: { minimum: 3, maximum: 25}
  validates_uniqueness_of :name
end

class ArticleCategory < ActiveRecord::Base
  belongs_to :article
  belongs_to :category
end

我的文章控制器

class ArticlesController < ApplicationController
before_action :set_article, only: [:edit, :update, :show, :destroy]
before_action :require_user, except: [:index, :show,]
before_action :require_same_user, only: [:edit, :update, :destroy]

def index
  @articles = Article.paginate(page: params[:page], per_page: 15)
  @article_list = @articles.group_by { |t| t.categories.name }
  @categories = Category.all
end 

我的文章index.html.erb是

<h1 align="center">Listing all articles by Category</h1>
<div class="container">
 <div align="center">

  <h2 align="center">Find your articles below</h2>
    <ul class="col-md-offset-3 nav nav-pills">
      <% @categories.each do |category| %>
        <li><a data-toggle="pill" href="#<%= category.name %>"><%= category.name %></a></li>
      <% end %>
    </ul>
 </div>
<% @article_list.each do |category, article_items| %>
 <div class="tab-content">
  <div id="<%= category %>" class "tab-pane fade in">
   <div class="panel-group" id="accordion">
    <% article_items.each do |article_item| %>
      <div class="panel panel-default">
        <div class="panel-heading" >
          <h4 class="panel-title">
            <a data-toggle="collapse" data-parent="#accordion" href="#<%= article_item.title %>">
            <%= article_item.title %></a>
          </h4>
        </div>
        <div id="<%= article_item.title %>" class="panel-collapse collapse">
          <div class="panel-body"><%=article_item.description %></div>
        </div>
      </div>
    <% end %>   
   </div>  
  </div> 
 </div>
<% end %>

</div>

这会显示药片和手风琴风格,但不会链接在一起。如何确保类别“药丸”选项卡仅显示手风琴中的相关文章?

1 个答案:

答案 0 :(得分:0)

我最后更改了一些代码以使其正常工作。我做的第一件事就是使用Categories控制器和索引页而不是文章控制器和索引页。

在我的分类控制器中,我有这个:

def index
  @categories = Category.all
end

在我的index.html.erb中,我将其更改为:

<h1 align="center">Listing all articles by Category</h1>
<div class="container">
  <div align="center">
      <h2 align="center">FAQ</h2>
        <ul class="col-md-offset-3 nav nav-pills">
          <% @categories.all.each do |cats| %>
            <li><a data-toggle="pill" href="#<%= cats.name %>"><%= cats.name %></a></li>
          <% end %>
        </ul>
  </div>
  <div class="tab-content">
    <% @categories.all.each do |cat| %>
      <div id="<%= cat.name %>" class="tab-pane fade">
        <div class="panel-group" id="accordion<%=cat.id%>">
          <% cat.articles.each do |article| %>
            <div class="panel panel-default">
              <div class="panel-heading" >
                <h4 class="panel-title">
                  <a data-toggle="collapse" data-parent="#accordion<%=cat.id%>" href="#<%= cat.name%><%= article.id %>">
                  <%= article.title %></a>
                </h4>
              </div>
              <div id="<%= cat.name%><%= article.id %>" class="panel-collapse collapse">
                <div class="panel-body"><%=article.description %></div>
              </div>
            </div>
          <% end %>
        </div> 
      </div>
    <% end %>
  </div>
</div>

这允许药片打开手风琴中的所有类别的文章,每个手风琴和文章都有独特的ID,这样所有的面板都可以正常工作,即使有些文章可以在多种手风琴中找到。

感谢您的帮助。