Rails:CoffeeScript或JavaScript资源文件中的访问控制器实例variables

在Rails 3.1中,无法使用<%= @foo%>等语法访问资产js.erb或coffee.erb文件中的控制器实例variables,其中在控制器中设置了@foo。 那么问题是将控制器variables传递给CoffeeScript或JavaScript资源的最佳方法是什么?

这个问题在论坛上已经有了多种复杂的forms,但是我要重申的一点是要有一个地方把所有的build议集中在一起,所提供的代码简单易读。 另外请注意,我特指资产而不是查看响应文件。

我曾经做过这样的几种方法

把数据放在隐藏字段中,在js / coffee中访问数据

# single value <%= hidden_field_tag "foo_name", @foo.name, { :id => "foo-name" } %> $('#foo-name').val(); # when the 'value' has multiple attributes <%= hidden_field_tag "foo", @foo.id, { :id => "foo", "data-first-name" => @foo.first_name, "data-last-name" => @foo.last_name } %> $foo = $('#foo') console.log $foo.val() console.log $foo.data("firstName") console.log $foo.data("lastName") 

另一个select:将数据加载到erb中的js数据结构中,从js / coffee中访问它

 <% content_for(:head) do %> <script> window.App = window.App || {}; window.App.Data = window.App.Data || {}; window.App.Data.fooList = [ <% @list.each do |foo| %> <%= foo.to_json %>, <% end %> ]; </script> <% end %> # coffee for foo in window.App.Data.fooList console.log "#{foo.id}, #{foo.first_name} #{foo.last_name}" 

我不是一个很大的粉丝构buildJavaScript数据的ruby像这样,有些事情只是感觉错误 – 它可以是有效的,虽然

另一个选项是:打一个ajax调用,并从服务器获取数据

我也对其他想法和方法感兴趣

有一个非常好的铁路演员和相当近期(二月2012)关于这个特定的主题: #324传递数据到JavaScript

它显示了3种方式:脚本标签,数据属性和Gongem。 我想房子涵盖了所有可用的技术。 我只提到,当你有大量的数据,dynamic数据或两者结合时,最好使用AJAX调用。

而不是使用隐藏的领域,我select添加一个数据属性的容器div jquery可以拿起。

 <div class="searchResults" data-query="<%= @q %>"></div> 

然后jQuery来访问它

 url: "/search/get_results?search[q]=" + $(".searchResults").data("query") + "&page=" + p 

我觉得这是最简洁的方式来传递数据到JavaScript。 在find没有办法将variables传递给控制器​​的rails资源pipe道的咖啡脚本文件之后。 这是我现在使用的方法。 不能等到有人用最好的导轨设置控制器的方式。

在控制器中:

 @foo_attr = { "data-foo-1" => 1, "data-foo-2" => 2 } 

在视图(HAML)中:

 #foo{@foo_attr} 

在CoffeeScript资产中:

 $("#foo").data("foo-1") $("#foo").data("foo-2") 

在JavaScript数据失控的情况下,即使在2015年,使用gon gem仍然是首选的方法。设置完gon之后,您可以通过简单地将数据分配给在轨道中的坤对象。

 (Gemfile) gem 'gon' (controller) def index gon.products = Product.all (layouts) <%= include_gon %> (public/javascripts/your_js_can_be_here.js) alert(gon.products[0]['id'); (html source automatically produced) <script> window.gon = {}; gon.products = [{"created_at":"2015", "updated_at":"2015, "id":1, "etc":"etc"}]; 

您可以阅读Gon或Ryan Bate的截屏video中的其他两个rails-javascript频道的详细实现细节。
http://railscasts.com/episodes/324-passing-data-to-javascript

您可以编辑variables并将其添加到控制器中的params数组中,然后在response.js.erb中访问它们。 这是一个params[:value]的例子:

 def vote value = params[:type] == "up" ? 1 : -1 params[:value] = value @public_comment = PublicComment.find(params[:id]) have_voted = @public_comment.evaluators_for(:pub_votes_up) << @public_comment.evaluators_for(:pub_votes_down) unless have_voted.include?(@current_user) # vote @public_comment.add_or_update_evaluation(:"pub_votes_#{params[:type]}", value, @current_user) else # unvote @public_comment.delete_evaluation(:"pub_votes_#{params[:type]}", @current_user) params[:value] = 0 end respond_to do |format| format.js # vote.js.erb end end 

这里是一个与response.js.erb相关的例子

 button = $('<%= ".pub#{params[:type]}_#{params[:id]}" %>') label = button.find('strong') <% comment = PublicComment.find(params[:id]) %> label.html('<%= comment.reputation_for(:"pub_votes_#{params[:type]}").to_i %>') <% if params[:value] == 1 %> button.addClass('btn-success') <% elsif params[:value] == -1 %> button.addClass('btn-danger') <% else %> if button.hasClass('btn-success') { button.removeClass('btn-success') } if button.hasClass('btn-danger') { button.removeClass('btn-danger') } <% end %> 
Interesting Posts