我有一个包含账户ID的Ruby数组。
我想将这个Ruby数组存储在Javascript数组中。
我想知道最好的方法是什么？
此外，当我尝试这样做时，似乎Javascript认为如果只输入一个帐户ID，则数组的大小应该是1。 有没有办法解决这个问题？ 我尝试过放在引号中，但似乎不起作用。
4个回答
46
假设你正在使用erb。第一种方法：
<%= javascript_tag "account_ids = #{account_ids.to_json.html_safe};" %>
问题在于这样创建了一个没有上下文的全局变量（谁在使用它？）。因此，我更愿意调用在您的JS代码中定义的函数：
<%= javascript_tag "setAccounts(#{account_ids.to_json.html_safe});" %>
- tokland
4
很好，看起来似乎可以工作。如果数组中只有一个项目，有什么解决方法吗？例如，如果我在数组中有一个帐户ID（比如2），并调用.length，则它会认为数组中有两个项目。 - Brian
@Brian：我不明白，你能把一些代码粘贴到问题中吗？如果你有一个 Ruby 数组，这应该可以正常工作，无论它有多少个元素（即使
account_ids.length 的值是 [2]，它也应该返回 1）。 - tokland没关系。我使用了一个循环，而且我从零开始而不是从一开始。谢谢你的帮助！ - Brian
当数组是js对象中的一个值时，例如
var obj = { key1: <%= @array.to_json %> };，我会得到错误信息：SyntaxError: illegal character，
并且箭头指向第一个斜杠。但是使用 raw() 方法可以解决这个问题：var obj = { key1: <%= raw @array %> };。 - 7stud39
这是我使用的方法。比如在控制器中有一个数组：
@my_array = [['city', 'number'], ['nyc', 39], ['queens', 98]]
我希望在slim中使用它并生成一个Google饼图，然后我可以通过以下方式在slim中获取JavaScript数组：
javascript:
var myJsArray = #{raw @my_array};
或者我可以在erb中像这样获取JavaScript数组：
var myJsArray = <%=raw @my_array%>;
在某种程度上，对我来说起作用。
- ken
3
3“
raw(ruby array)”对我来说很好用，它可以将Ruby数组转换为JavaScript数组。 - overallduka当我这样做时，
raw() 对我有用，而 to_json() 则不行：var obj = {key1: <% raw @array %> }; - 7stud这个“原始”的技巧很有效 - 我不需要一个json对象，只需要我的JS变量中的数组。当Rails中的js.erb渲染失败时，你得不到任何错误消息来帮助你解决问题，而且你也不能在浏览器检查器控制台中测试这种情况。如果没有这个答案，谁知道还要花费多少小时来完成这个琐碎的任务。非常感谢！ - JosephK
5
如果您的控制器中有以下代码：
您可以在视图中像这样设置JavaScript变量：
@my_array = [1, 2, 3]
您可以在视图中像这样设置JavaScript变量：
您可以在视图中使用以下代码设置JavaScript变量：
<script type="text/javascript">
var myJSArray = new Array(<%= @my_array.map(&:to_s).join(", ") %>);
</script>
或者：
var myJSArray = [<%= @my_array.map(&:to_s).join(", ") %>];
这两种情况都会将你的Ruby数字ID值数组转换为字符串数组，然后使用逗号将这些字符串值连接起来，以输出JavaScript中的有效值。
如果你想在JavaScript中使用字符串表示，你需要在Ruby数组中的值周围添加双引号：
var myJSArray = [<%= @my_array.map { |some_id| '"' + some_id.to_s + '"' }.join(", ") %>];
- Shadwell
0
根据@Shadwell提出的最后一个解决方案，我更喜欢这样的方式：
var myJSArray = new Array("#{@my_array.map(&:inspect).join(", ")}");
我的示例没有使用ERB，因为它是用于MongoDB的MapReduce函数。
- VP.
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接