从Haml调用外部javascript中的ruby数组

Call a ruby array in external javascript from Haml

本文关键字:中的 ruby 数组 javascript 外部 Haml 调用      更新时间:2023-09-26

我是RoR和web应用程序开发的新手,我使用Rails 3.2.3,我想在Highcharts中使用ruby数组,我在视图文件中使用Haml。

我在控制器中定义了一个数组,如下所示:

...
def show
  ...
  @close_array = DailyQuote.where(company_id: @company.id).map(&:closing_price)
end

我已经在我的Haml视图文件中声明了它。

%body
  - close_array_j = "#{@close_array.inspect}"
  =javascript_include_tag :build_chart
  #container{:style => "min-width: 300px; height: 300px; margin: 0 auto"}

现在,我想在Highcharts图表中使用这个数组close_array_j,我已经在一个名为build_chart.js:的单独文件中为其编写了代码

$(function () {
  var chart;
  $(document).ready(function() {
  chart = new Highcharts.Chart({
    chart: {
      renderTo: 'container',
      },
...
    series: [{
      name: 'Closing Price',
      data: $('#close_array_j')
    }]
...

呈现的高图表没有任何数据。顺便说一句,我不太了解ruby、haml或js,你可能知道。。。

您可以在HAML 中打印这样的变量

%script
  != "close_array_j = #{@close_array.to_json};"

然后在javascript 中使用

...
series: [{
    name: 'Closing Price',
    data: close_array_j
}]
...

您在haml视图文件中进行的变量赋值没有任何效果。它不会自动将自己应用到javascript文件中。

您可以将其封装在脚本标记中。这是erb版本:

<%= javascript_tag do %>
 close_array_j =  = '<%= j @close_array.to_json %>';
<% end %>

然而,还有其他更清洁的技术。一种是利用HTML5数据属性来嵌入像您这样的数据。使用Jquery很容易访问。

我建议您观看Ryan Bate关于如何以各种方式将数据传递到javascript的屏幕广播。

http://railscasts.com/episodes/324-passing-data-to-javascript?view=asciicast