将数据从控制器传递到Rails中的资产js

Question

我正在使用Rails 5.我试图将控制器中的数据（从sql查询中获取）传递给assss中的js文件。 我从控制器运行查询为

@sample = Sample.all  

我需要在全日历事件中显示数据。
资产/ js文件

$('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'agendaDay,listWeek,agendaWeek,month'
            },
            editable: true,
            eventLimit: true, // allow "more" link when too many events
            defaultView: 'listWeek',
            navLinks: true,
            events: [
                <% @sample.each do |sample| %>
                {
                    title: '<%= sample.title %>',
                    start:  TODAY + 'T09:00:00',
                    description: '<%= sample.description %>'
                }
                <% end %>  

它没有以全日历显示结果。 如何将其从控制器传递到Asset / js
非常感谢您的快速回复

Answer 1

一种简单的方法是将局部放置在layouts / _variables.html.erb中 ，然后将其呈现在应用程序布局的<script>标记中。

例如：

<script>    
  _app.samples = [
  <% @sample.each do |sample| %>
       {
         title: '<%= sample.title %>',
         start:  TODAY + 'T09:00:00',
         description: '<%= sample.description %>'
      }
  <% end %>  
  ];
</script>

然后在原始日历中，直接使用生成的Javascript：

  $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'agendaDay,listWeek,agendaWeek,month'
        },
        editable: true,
        eventLimit: true, // allow "more" link when too many events
        defaultView: 'listWeek',
        navLinks: true,
        events: _app.samples,

在layouts / application.html.erb中

</script>
  <%= render partial: "layouts/_variables" %>
  <%= csrf_meta_tags %>
  ...

它的好处是您不需要使用Rails代码污染Javascript资产，并且每次刷新页面时都会更新数据，而无需额外往返服务器。

缺点是您需要单独考虑Ajax请求（尽管这是一个完全不同的问题），并且应注意将这些变量放置在应用程序特定的结构中，以免用随机变量污染全局空间。

Answer 2

您可以使用gon gem解决此问题，例如以下示例：

在控制器文件中：

gon.user_id = @ user.id

在js文件中：

console.log（gon.user_id）;

“ Gon gem-在您的js中获取Rails变量。如果您需要将一些数据发送到js文件中，并且您不想长时间通过视图和解析来执行此操作，请使用此力！ ”

有关更多信息：

https://github.com/gazay/gon