スリムテンプレート内のCoffeeScriptエンジンでインスタンス変数にアクセスする方法

私はインスタンス変数を設定しているRailsコントローラを持っています -

@user_name = "Some Username"

私の.slimテンプレートでは、javascriptを生成するためにコーヒーエンジンを使用していて、クライアントのsie javascriptコードからユーザー名を出力したい -

coffee:
  $(document).ready ->
    name = "#{@user_name}"
    alert name

しかし、これは生成されているJavaScriptですか?

$(document).ready(function() {
    var name;
    name = "" + this.my_name;
    alert(name);
}

CoffeeScriptコードのコントローラインスタンス変数にはどうすればアクセスできますか?

CoffeeScriptを使用しているときに同じ問題が発生すると思いますので、これをhamlとしてタグ付けしています。

48
@Thiloいいえ、彼はRuby変数 @user_name を注入しようとしています。 RubyとCoffeeScriptは同じ文字列補間構文を使用します。
追加された 著者 Trevor Burnham,
stackoverflow.com/questions/17560864/… 類似の質問/ソリューション
追加された 著者 MrYoshiji,
そうですか。ところで、変数名が "#{@ user_name}" から this.my_name にどのように変わるのでしょうか?
追加された 著者 Thilo,
coffeescriptで@propがthis.propにコンパイルされるため
追加された 著者 Cameron Martin,

3 答え

起こっているのは、 "#{@ user_name}" がCoffeeScriptソースとして評価され注入されたRubyコードではなく、CoffeeScriptとして解釈されていることです。あなたは、 "Ruby変数をCoffeeScriptソースにどのように注入するのですか?"

短い答えは:これをしないでください。 Railsのチームは、3.1のテンプレートに埋め込まれたCoffeeScriptをサポートしないことを意図的に決めました。なぜなら、あらゆる要求に対してCoffeeScriptをコンパイルしなければならないためにパフォーマンス上のオーバーヘッドが発生するからです(任意の文字列をソースに注入する場合、 。

私のアドバイスはRuby変数を純粋なJavaScriptとして個別に提供してから、それらの変数をCoffeeScriptから参照することです。

javascript:
  user_name = "#{@user_name}";
coffee:
  $(document).ready ->
    name = user_name
    alert name
87
追加された
これは、Slimがすべての要求に対してテンプレート内のCoffeeScriptを再コンパイルするかどうかによって異なります。私は正直には分かりません。とにかくそれを外部ファイルに移動する必要があります。 JSに一度だけコンパイルされ、ブラウザがそれをキャッシュします。
追加された 著者 Trevor Burnham,
あなたの返事をありがとう、基本的にあなたが提案したものは、パフォーマンスの観点から大丈夫ですか?
追加された 著者 kapso,

私はすべてのコストでインラインJavaScriptを避ける傾向があります。

HTMLに変数を格納し、JavaScriptから使用するには、HTML5のデータ属性を使用するのが良い方法です。これはあなたのJavaScriptを目立たないように保つのに理想的です。

32
追加された
javascriptのMVCを使用している場合、ほとんどの場合、データを取得するためにajaxリクエストを行い、クライアントのhtmlをレンダリングします。しかし、たとえば、一般的な設定パラメータは、html/body/containerのデータ属性で一度送信できます。
追加された 著者 nathanvda,
これは、JavaScript MVCを使用していて、サーバーへの複数のHTTP要求を避けたい場合に役立ちません。 backbonejs.org/#FAQ-bootstrap
追加された 著者 jackyalcine,
本当、真実。私が非常に発疹から来たら申し訳ありません!
追加された 著者 jackyalcine,

あなたはまた使用することができます:

$(document).ready ->
  name = <%= JSON.generate @user_name %>
  alert name

これは、 JSON がJavaScriptのサブセットであるためです。

2
追加された
これは難しいです。または、少なくともDashingの.coffeeファイル内にあります。
追加された 著者 Jameson Triplett,