如何在 Rails 应用程序上放置一个选择框来选择网站的语言？

Question

我是 Rails 新手，我已经学会了如何使用区域设置来更改我的网站语言，但我想在导航栏的右侧放置一个选择框，它可以传递变量/会话来更改整个网站语言。这可能吗？我使用 Windows 和 Ruby：1.9.3，Rails：3.2.2

到目前为止，这是我在“layouts/application.html.erb”上的导航栏：

<div class="upmenu">
    <ul align="left">
        <li><a href="/issues"><%=t "nav.issues.list" %></a></li>
        <li><a href="/issues/new"><%=t "nav.issues.new" %></a></li>
        <li><a href="/timeline/index"><%=t "nav.timeline" %></a></li>
        <li><a href="/projects"><%=t "nav.projects" %></a></li>
        <%= yield :nav %>       
    </ul>
    <ul id="language">
        <li><%= select_tag(:lang, options_for_select([['Portuguese', 'pt'], ['English', 'en']])) %></li>
    </ul>
</div>

记住我的网址使用了以下范围，所以它类似于 >“Localhost:3000/en/issues/”

  scope "/:locale" do

    get "/timeline/index", to: "timeline#index"

    resources :projects

    resources :issues
  end

这是我的路线：

timeline_index GET    /:locale/timeline/index(.:format)    timeline#index
      projects GET    /:locale/projects(.:format)          projects#index
               POST   /:locale/projects(.:format)          projects#create
   new_project GET    /:locale/projects/new(.:format)      projects#new
  edit_project GET    /:locale/projects/:id/edit(.:format) projects#edit
       project GET    /:locale/projects/:id(.:format)      projects#show
               PUT    /:locale/projects/:id(.:format)      projects#update                                                           
               DELETE /:locale/project
               DELETE /:locale/projects/:id(.:format)      projects#destroy                                                          
.:format)            issues#index
        issues GET    /:locale/issues(.:format)            issues#index
               POST   /:locale/issues(.:format)            issues#create                                                             
               PUT    /:locale/projects/:id(.:format)      projects#update
               DELETE /:locale/projects/:id(.:format)      projects#destroy
        issues GET    /:locale/issues(.:format)            issues#index
               POST   /:locale/issues(.:format)            issues#create
     new_issue GET    /:locale/issues/new(.:format)        issues#new
    edit_issue GET    /:locale/issues/:id/edit(.:format)   issues#edit
         issue GET    /:locale/issues/:id(.:format)        issues#show
               PUT    /:locale/issues/:id(.:format)        issues#update
               DELETE /:locale/issues/:id(.:format)        issues#destroy

Answer 1

是的，这是可能的

在你看来

<li><%= select_tag(:locale, options_for_select([['Portuguese', 'pt'], ['English', 'en']])) %></li>

在你的应用程序控制器中

before_action :set_locale
 def set_locale
    I18n.locale = params[:locale] || I18n.default_locale
  end 

Answer 2

您不必为此使用选择框。

这是我想出的解决方案：

配置/application.rb

config.i18n.available_locales = [:en, :de, :es]
config.i18n.default_locale = :en

---

应用程序/控制器/application_controller.rb

class ApplicationController

  around_action :set_locale

private

  def set_locale(&action)
    locale = params[:locale] || I18n.default_locale
    I18n.with_locale(locale, &action)
  end

end

---

应用程序/helpers/language_helper.rb

module LanguageHelper

  LANGUAGES = {
    :en => "English",
    :de => "Deutsch",
    :es => "Espagnol"
  }

  def language_selector
    active_locale = I18n.locale
    inactive_locales = I18n.available_locales - [active_locale]
    content_tag :li do
      elements = [
        link_to(LANGUAGES[active_locale], nil, :class => "dropdown")
      ]
      elements << content_tag(:ul) do
        links = []
        inactive_locales.each do |locale|
          link = link_to LANGUAGES[locale], params.permit(:locale).merge(:locale => locale)
          links << content_tag(:li, link)
        end
        links.join.html_safe
      end
      elements.join.html_safe
    end
  end

end

---

现在只需将

language_selector

放在您需要的位置，例如页面的右上角。它生成的标记是这样的（它可能需要一些 CSS 样式和/或 Javascript 功能）：

<li>
  <a class="dropdown" href="/de">Deutsch</a>
  <ul>
    <li><a href="/en">English</a></li>
    <li><a href="/es">Espagnol</a></li>
  </ul>
</li>

享受吧！