Razor C＃コードを.jsファイルに埋め込む方法は？

Question

は

<script type='text/javascript'> 
    ... 
</script> 

とjavascriptのコードブロックを埋め込むために持っていますが、カミソリコードが.cshtmlファイルからインクルード.jsファイルにコンパイルされません。

この作品を作成するには？あるいは、他にも同様の効果をもたらすエレガントな方法がありますか？

ありがとうございます。

Answer 1

私は時々、この問題に直面したとき、私は.cshtmlファイルにアクセス可能である.jsファイル内の関数を提供します...

// someFile.js 
var myFunction = function(options){ 
    // do stuff with options 
}; 

// razorFile.cshtml 
<script> 
    window.myFunction = new myFunction(@model.Stuff); 
    // If you need a whole model serialized then use... 
    window.myFunction = new myFunction(@Html.Raw(Json.Encode(model))); 
</script> 

必ずしも最良の選択肢が、それはやる場合私はあることに同意している間、あなたは多分試みることができる他の事は

//someFile.js 
var options = $("#stuff").data('stuff'); 

// razorFile.cshtml 
<input type="hidden" id="stuff" data-stuff="@model.Stuff" /> 

Answer 2

できません。また、試してみてください。それらを分けてください。これはまったく逆ですが、Unobtrusive JavaScriptを調べる必要があります。プロジェクト全体を通して適用されたデザインパターンは素晴らしい考えです。

Answer 3

...データがjQuery.validate.unobtrusiveがないかのようなあなたのHTML要素に属性を使用しているそれをしなければならない...

Javascriptファイルの中でRazorを使用することについて2回考えなければなりません.Nugetのパッケージがあります。それはRazorJSと呼ばれています。

パッケージの作成者はblog postです。その使用方法が説明されています。

Answer 4

おそらく、私が達成したいことに応じて、便利な回避策を提供することができます。

私は、Javaスクリプトファイルでかみそりの表現を評価する方法を見つけようとしました。 jQueryのクリックイベントハンドラをアタッチして、多くのページにある特定のクラスを送信したいと考えました。これは、jQueryドキュメント準備完了イベントハンドラで行う必要があります。このクリックイベントはajax呼び出しを実行します。

これらのURLは、アプリケーションがルートレベルより下にある場合に、絶対的なものではなく、相対的なものでなければなりません。

 $(document).ready(function() { 
      Checkit('@Url.Content("~/checkit")'); 
     }); 

javascriptのコードのほとんどはまだある：だから、私は機能Checkit内のコードをラップし、レイアウトビューに呼び出しを移動することでこの問題を解決しまし

$(document).ready(function() { 
    $('input[type="submit"].checkit)').click(function (e) { 
     $.ajax({ 
      type: 'POST', 
      url: '@Url.Content("~/checkit")', //Razor expression here 
      dataType: 'json', 
      success: function (data) { 
       if (!data) { 
        e.preventDefault(); 
        handleResponse(data); 
       } 
      }, 
      data: null, 
      async: false 
     }); 
    }); 
}); 

のようなものを使用していましたjavascriptファイル。

Answer 5

JavascriptをサポートするRazorのサンプルWebページ（MVCビューではありませんが、同様です）です。もちろん、Javascriptファイルを動的に記述するのは非典型ですが、ここでもサンプルがあります。私は、JSONデータなどのデータを提供したい場合や、まれにしか計算や変更が必要なものを提供したかったので、これを使用しました。そのため、ブラウザーにはJSファイルを含めることができます。ここでのトリックは、Response.ContentTypeを設定して、あなたのJavascriptにRazor <text>タグのようなものを使用することです。

@{ 
Response.ContentType = "text/javascript"; 
Response.Cache.SetLastModified(System.Diagnostics.Process.GetCurrentProcess().StartTime); 
Response.Cache.SetExpires(System.DateTime.Now.Date.AddHours(28)); 
Response.Cache.SetCacheability(System.Web.HttpCacheability.Public); 
<text> 
var someJavaScriptData = @someSortOfObjectConvertedToJSON; 
function something(whatever){ 
} 
</text> 
} 

次に、あなたの他のカミソリのファイルになるようにそれを含めることができます唯一のJSが含まれてい.cshtmlなど約

<script src="MyRazorJavascriptFile.cshtml"></script> 

Answer 6

そして、何？

.csthml親JS

<script type="text/javascript"> 
alert('@Datetime.ToString()'); 
</script>