Rails - 如何将 css 添加到辅助方法

Rails - how to add css to a helper method

我试图将一个长 if 语句从我的视图中移出并移到辅助方法中。

我目前有:

module ProfilesHelper
    def items_for_profile_menu(profile)
        if current_user = @profile.user_id 
      "<li class="col-xs-4 col-sm-2 nopadding menuitem" style="background:#006F7F">
               <a href="index.html" class="hvr-sweep-to-bottom">
                       # link_to dashboard_path(@profile.dashboard) 
                      <span>Dashboard</span>
               </a>

        </li>

                <li class="col-xs-4 col-sm-2 nopadding menuitem" style="background:#39AFBF">
                     <a href="#resume" class="hvr-sweep-to-bottom">
                     <!-- <i class="flaticon-graduation61"></i> --><br><br>
                     <span>Timeline</span></a>
        </li>"

    <% else %>

                  "<li class="col-xs-6 col-sm-3 nopadding menuitem orange">
                     <a href="#stats" class="hvr-sweep-to-bottom"><i class="flaticon-placeholders4"></i><span>Impact</span></a>
                  </li>
                  <li class="col-xs-6 col-sm-3 nopadding menuitem red">
                     <a href="#feedback" class="hvr-sweep-to-bottom"><i class="flaticon-earphones18"></i><span>Feedback</span></a>
                  </li>"
               <% end %>

    end


end

我不知道是否可以在助手本身中写入 css?如果可以,我如何才能了解使其正常工作所需的修改?在视图中,我能够在列表项中写入:background:#006F7F。如果我将它添加到帮助器中 - 那么 # 将作为评论收到。

谁能看到如何使用 CSS 设置辅助方法?

例如使用.html_safe

def my_name
    name = "<h1>Eric Santos!</h1>"
    name.html_safe
 end

希望你明白了!

您没有在代码中正确终止字符串。一个双引号 (") 将终止前一个双引号 (")。所以你的字符串被认为像 "<li class=" 作为一个字符串并在那之后寻找 " 如果不是这种情况你会得到错误。

因此,为了在大字符串中声明 class,请在大双引号 (") 字符串中使用单引号 (') 并将每个大字符串与 (+).

要添加 class 使用单引号 "<li class='col-xs-4 col-sm-2 nopadding menuitem'>Hi </li>" + "<li class='col-xs-4 col-sm-2 nopadding menuitem'>Hello </li>"

像下面这样更改您的代码。

module ProfilesHelper
  def items_for_profile_menu(profile)
    if current_user = @profile.user_id 
      "<li class='col-xs-4 col-sm-2 nopadding menuitem' style='background:#006F7F'>
        <a href='index.html' class='hvr-sweep-to-bottom'>
          <span>Dashboard</span></a>
      </li>
      <li class='col-xs-4 col-sm-2 nopadding menuitem' style='background:#39AFBF'>
        <a href='#resume' class='hvr-sweep-to-bottom'>
        <span>Timeline</span></a>
      </li>"
    else
      "<li class='col-xs-6 col-sm-3 nopadding menuitem orange'>
        <a href='#stats' class='hvr-sweep-to-bottom'><i class='flaticon-placeholders4'></i><span>Impact</span></a>
      </li>
      <li class='col-xs-6 col-sm-3 nopadding menuitem red'>
        <a href='#feedback' class='hvr-sweep-to-bottom'><i class='flaticon-earphones18'></i><span>Feedback</span></a>
      </li>"
    end
  end

end