このパーティーに来るのが少し遅れたことに気づきましたが、最近使用しているソリューションを投入したいと思いました. ただし、最初に申し上げておきます...
Rails 3.1/3.2 Way (いいえ、私は好きではありません。)
参照: http://guides.rubyonrails.org/asset_pipeline.html#how-to-use-the-asset-pipeline
この回答に完全を期すために、また実行不可能な解決策ではないため、以下を含めています...あまり気にしませんが。
「Rails Way」は、この質問の元の作成者が要求したビュー指向ではなく、コントローラー指向のソリューションです。それぞれのコントローラーにちなんで名付けられたコントローラー固有の JS ファイルがあります。これらのファイルはすべて、application.js の require ディレクティブのいずれにもデフォルトで含まれていないフォルダー ツリーに配置されます。
コントローラー固有のコードを含めるために、以下がビューに追加されます。
<%= javascript_include_tag params[:controller] %>
私はこの解決策を嫌いますが、そこにあり、迅速です。おそらく、代わりにこれらのファイルを「people-index.js」や「people-show.js」などと呼び"#{params[:controller]}-index"
、ビュー指向のソリューションなどを使用することもできます。繰り返しますが、簡単に修正できますが、私にはうまくいきません。
私のデータ属性の方法
私を狂ったように呼んでください。しかし、デプロイするときに、すべての JS をコンパイルして application.js に縮小したいと考えています。これらの小さなストラグラー ファイルをあちこちに含めることを忘れないようにしたいのです。
すべての JS を 1 つのコンパクトな、近々ブラウザーにキャッシュされるファイルにロードします。ページで application.js の特定の部分を起動する必要がある場合は、Rails ではなく、HTML に指示させます。
JS を特定の要素 ID にロックしたり、HTML にマーカー クラスを散らかしたりするのではなく、 というカスタム データ属性を使用しますdata-jstags
。
<input name="search" data-jstag="auto-suggest hint" />
各ページで、優先 JS ライブラリ メソッドをここに挿入して、DOM の読み込みが完了したときにコードを実行します。このブートストラップ コードは、次のアクションを実行します。
- でマークされた DOM 内のすべての要素を反復処理します。
data-jstag
- 要素ごとに、属性値をスペースで分割し、タグ文字列の配列を作成します。
- タグ文字列ごとに、そのタグのハッシュでルックアップを実行します。
- 一致するキーが見つかった場合は、それに関連付けられている関数を実行し、要素をパラメーターとして渡します。
たとえば、application.js のどこかに次のように定義されているとします。
function my_autosuggest_init(element) {
/* Add events to watch input and make suggestions... */
}
function my_hint_init(element) {
/* Add events to show a hint on change/blur when blank... */
/* Yes, I know HTML 5 can do this natively with attributes. */
}
var JSTags = {
'auto-suggest': my_autosuggest_init,
'hint': my_hint_init
};
ブートストラップ イベントは、検索入力に対してmy_autosuggest_init
andmy_hint_init
関数を適用し、ユーザーが入力している間に提案のリストを表示する入力に変換し、入力が空白のままでフォーカスされていない場合に何らかの入力ヒントを提供します。
一部の要素が でタグ付けされていない限りdata-jstag="auto-suggest"
、自動提案コードは起動しません。ただし、それは常にそこにあり、縮小され、最終的にはページで必要なときに application.js にキャッシュされます。
タグ付けされた JS 関数に追加のパラメーターを渡す必要がある場合は、創造力を働かせる必要があります。data-paramter 属性を追加するか、ある種のパラメーター構文を考え出すか、ハイブリッド アプローチを使用することもできます。
コントローラー固有の複雑なワークフローがある場合でも、lib フォルダーにファイルを作成し、それを application.js にパックして、「new-thing-wizard」などのタグを付けるだけです。ブートストラップがそのタグに到達すると、素敵で凝ったウィザードがインスタンス化されて実行されます。必要に応じてそのコントローラーのビューに対して実行されますが、それ以外の場合はコントローラーに結合されません。実際、ウィザードを正しくコーディングすれば、すべての構成データをビューで提供できる可能性があるため、後でウィザードを必要とする他のコントローラーにウィザードを再利用できる可能性があります。
とにかく、これは私がしばらくの間ページ固有の JS を実装してきた方法であり、単純なサイト設計とより複雑でリッチなアプリケーションの両方に役立ちました。ここで提示した 2 つの解決策 (私の方法または Rails の方法) のいずれかが、将来この質問に出くわした人にとって役立つことを願っています。