web-dev-qa-db-ja.com

Rails 3.1を使用したコーヒースクリプトのerb

次の例のように、.coffeeファイルでerbを使用したい

myLatlng: new google.maps.LatLng(<%[email protected] %>, <%[email protected] %>)

locations.js.coffeeの名前をlocations.erb.coffeeに変更しました

でも次のエラーが出ます

Error compiling asset application.js:
ExecJS::ProgramError: Error: Parse error on line 4: Unexpected 'COMPARE'
  (in /Users/denisjacquemin/Documents/code/projects/geolog/app/assets/javascripts/locations.erb.coffee)
Served asset /application.js - 500 Internal Server Error
28
denisjacquemin

YOUR VIEWフォルダーの.coffeeファイルにerbが必要な場合は、ファイル名をyourfilename.js.coffeeのままにしてください。Railsでも奇妙にERBを処理します。

Herokuで機能させるには、Gemfileのアセットグループからcoffee-Railsを移動します。

76
Arcolye

Erbがcoffeeの前に処理されるように、ファイルの名前をlocations.coffee.erbに変更する必要があるかもしれません:)

13
Clément

js.erbビューを使用する代わりに、可能な場合はRails 4でアセットパイプラインに固執します。

Ruby on Rails-JavaScript変数をコントローラーから外部JavaScriptアセットファイルに送信する で説明されているgonまたは他のいくつかの手法を使用して、変数をJに渡します。

gonの場合:

app/views/layouts/application.html.erb:

<head>
  <meta charset="utf-8"/>
  <%= include_gon %>

app/controllers/application_controller.rb:

before_filter do
  gon.latitude = 0.1
  gon.longitude = 0.2
end

app/assets/javascripts/locations.js.coffee:

myLatlng: new google.maps.LatLng(gon.latitude, gon.longitude)

ファイルは起動時に一度だけプリコンパイルされ、Railsではなくサーバーによって提供され、残りのJと同じHTTPリクエストで処理されるため、この方法はより高速です。

Rails 3.2.8では、.coffeeファイルを/ app/viewsに移動する必要はありませんでした。ファイル名に.erbを追加し、/ app/assets/javascriptsに残しました。つまり、私は

/app/assets/javascripts/user_answers.coffee.js to 
/app/assets/javascripts/user_answers.coffee.js.erb

そしてこれはうまくいきました:

# Note the level of indentation.
var x = 2;

<% Question.first(2).each do |eq| %>
alert('eq: ' + <%= eq.id %>)
<% end %>

(インデントレベルはRubyではなくCoffeeScriptで一致する必要があります。)ルビーに埋め込まれたコーヒーをお楽しみください。

4
David Beckwith

特にHerokuを使用している場合は、Ciro Centelliがアセットパイプラインをそのままにすることに同意します。間違いなくgonは多くの割り当てが必要な場合に便利ですが、gemがなくてもこれを行うことができます。あなたのhtmlに含める

<%= javascript_tag do %>
    window.latitude = <%[email protected] %>
    window.longitdue = <%= @location.longitude %>
<% end %>

そしてあなたのコーヒーファイルに

myLatlng: new google.maps.LatLng(window.latitude, window.longitude)

多くの場合、同様の方法で他のニーズに対処できます。たとえば、特定のIDを持つ要素でコーヒースクリプトをトリガーしたくない場合は、htmlでerbを使用して、トリガーしたいときにのみそのIDを追加します。

1
Obromios