將Rails變量傳遞給JavaScript

Question

我想將變量從Rails控制器傳遞到JavaScript文件。 我找到了一些解決方案，現在有：

 # controller def index @coords = Map.all end #view <%= content_tag 'div', id: 'coords', data: {coords: @coords } do %> <% end %> #javascript alert($('#coords').data(coords)); 

編輯：

$('#coords').data(coords)返回一個對象Object 。

如何在javascript中訪問coords的特定屬性，例如coord.lat等？ 另外， @coords會自動轉換為JSON ？

注意：我不能使用gon gem。 我認為Rails 4.2不支持它。 所以我需要一個沒有寶石的解決方案。

Answer 1

在這里我怎么用寶石gon與軌道-4.2.0。 沒什么特別的：

# Gemfile.lock where rails binded to version 4.2.0
gon (5.2.3)
  actionpack (>= 2.3.0)
  json
  multi_json
  request_store (>= 1.0.5)
....
PATH
remote: engines/mobile_api
specs:
  mobile_api (0.1)
    itunes-receipt
    rails (~> 4.2.0)

---

# Gemfile
source 'http://rubygems.org'

gem 'rails', '4.2.0'
gem 'gon'

---

# layout main.html.slim
doctype html
html
  head
    meta charset="utf-8"
    = include_gon

---

# main_controller.rb (In the controller)
class MainController < ApplicationBaseController
  before_action :start_marketing_split_test
  layout 'main'

  # ... actions here

  def start_marketing_split_test
    split_test_name = 'ab_test_1'
    alternatives_loader =       
      Marketing::AB::AlternativesLoader.new(split_test_name)

    alternative = ab_test(split_test_name,        
                          alternatives_loader.alternatives)

    gon.push({"#{split_test_name}" => JSON.parse(alternative)})
 end

============================

但是，如果您需要不帶gon解決方案，則可以在后端模板中傳遞變量：

例如：

# layouts/application.html.slim

doctype html
html
  head
    meta charset="utf-8"
    title
  body
javascript:
  window.app_options = {
    'flash_alert': "#{raw(flash[:alert])}",
    'flash_warning': "#{raw(flash[:warning])}",
    'flash_notice': "#{raw(flash[:notice])}",
    'current_user_id': "#{current_user.try(:id)}",
    'current_user_phone': "#{current_user.try(:phone)}"
  };

Answer 2

使用jQuery .data(key)檢索數據屬性值時，您使用的key應該是String 。 是的， data: { coords: @coords}自動將@coords轉換為JSON字符串。 因此，如果您這樣稱呼它，它應該對您有用：

$('#coords').data('coords');
# Returns array of JavaScript coord objects.
$('#coords').data('coords')[0].id;
# Returns first coord's id.

Answer 3

像下面這樣使用輔助方法呢？

<%= content_tag 'div', id: 'coords', data: <%= json_for @coords%> do %> module ApplicationHelper def json_for(target_model) target_model.to_json #generates a json object end end

https://github.com/rails-api/active_model_serializers

Answer 4

您可以在視圖文件中使用

<%= javascript_tag do %>
  var1 = @coords.lat
  var2 = @coords.lgt
<% end %>

那么您可以通過javascript代碼訪問var1和var2。