如何将 Rails 变量放入 JavaScript 文件 (D3)答案

【问题标题】：How to get a Rails variable into JavaScript file (D3)如何将 Rails 变量放入 JavaScript 文件 (D3)
【发布时间】：2018-08-01 19:10:43
【问题描述】：

我需要从数据库中获取数据并将其传递给我的 Rails 5 应用程序中的 JavaScript 文件。

在我的控制器中，我创建了一个如下所示的变量：

@this_anomaly = Anomaly.find_by_id(2)

显然，我可以通过以下方式访问它以及在我看来：

<%= @this_anomaly.started_at %>

但我需要将相同的数据放入我的 javascript 文件中，我使用该文件在 D3 中绘制图形以注入到我的视图中。我如何通过它？

不知道从哪里开始，谢谢！

【问题讨论】：

【解决方案1】：

你可以在你的 html.erb 中声明你的 javascript 变量

var started_at = <%= @this_anomaly.started_at %>

【讨论】：

在脚本标签内？因为否则它会将其打印为文本？
我需要将相同的数据放入我的 javascript 文件中 - 在我看来，这样不会解决问题。
@LaurenAH，对，您可能还必须在脚本标签中执行 d3。这取决于 rails turbolinks 和你的 js 文件是如何加载的。如果带有 d3 的 js 文件在 html 上的脚本之后加载，则该变量将可用。尝试寻找一种在脚本标签中始终在 js 之后加载外部 js 文件的方法。

【解决方案2】：

一种选择是将 HTML 中的数据放在 data 属性中

<div data-started-at=<%= @this_anomaly.started_at %> data-for-d3-graphics></div>

然后在你的js文件中

let value = $('div[data-for-d3-graphics]').data('started-at');

我不确定这是否是 .erb 文件的确切语法，但你明白了

【讨论】：

【解决方案3】：

所以我尝试过的一种可行的方法（因为我使用的是 d3）是在我的 html.erb 中请求数据：

<div id="anomaly_data">
    <%= @this_anomaly.started_at %>
</div>

然后在我的js文件中，使用d3.select将其存储在一个变量中：

var anomaly = d3.select("#anomaly_data").text();

这可以让我知道日期/时间/等，而无需对其进行任何处理！但是，一定有更好的方法吗？

【讨论】：