Javascript（MVCではなく）の中でRazorを使用

私の場合、私はJavaScriptの中で剃刀を使用できるかどうか知りたいです！Javascript（MVCではなく）の中でRazorを使用

<html> 
    <head> 
    <!--Load the AJAX API--> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script type="text/javascript"> 

    // Load the Visualization API and the corechart package. 
    google.charts.load('current', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.charts.setOnLoadCallback(drawChart); 

    // Callback that creates and populates a data table, 
    // instantiates the pie chart, passes in the data and 
    // draws it. 
    function drawChart() { 

     // Create the data table. 
     var data = new google.visualization.DataTable(); 
     data.addColumn('string', 'Topping'); 
     data.addColumn('number', 'Slices'); 
     data.addRows([ 
      ['Mushrooms', 3], 
      ['Onions', 1], 
      ['Olives', 1], 
      ['Zucchini', 1], 
      ['Pepperoni', 2] 
     ]); 

     // Set chart options 
     var options = {'title':'How Much Pizza I Ate Last Night', 
        'width':400, 
        'height':300}; 

     // Instantiate and draw our chart, passing in some options. 
     var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
     chart.draw(data, options); 
     } 
    </script> 
    </head> 

    <body> 
     <!--Div that will hold the pie chart--> 
     <div id="chart_div"></div> 
    </body> 
</html>

これは、静的な値と円グラフが表示されますし、私は彼らが私のページのデータに基づいて変更することができるようにチャートの番号にいくつかの変数を追加したいと思いGoogleからのちょうど基本的なコードです。これがその場合に重要な部分である

data.addRows([ 
     ['Mushrooms', 3], 
     ['Onions', 1], 
     ['Olives', 1], 
     ['Zucchini', 1], 
     ['Pepperoni', 2] 
    ]);

基本的に、私は例@numberか何かのためのような変数をかみそりするために、このコードで番号を交換したいと思い、これは可能ですか？

答えを探しているうちに、javascriptコードを追加するとひげ剃りが可能になることがわかりましたが、私ができたときにはチャートが表示されなくなってしまったので、ちょうど<text>コード。

Google Charts APIの経験があり、これをより良い方法で全体的に行う方法が分かっている場合は、

出典

2017-01-13 Pontus Svedberg

を使用して、任意の.NETオブジェクトをレンダリングすることができ、* *使用が最も些細な情報を除き、JavaScriptコードに値を注入したことがありません。これは、別々のJSファイル（バンドル、キャッシング、TypeScriptなど）のすべての利点をバイパスします。代わりに、DOMに値を注入するだけです（例えば、 'data-'属性）、または最悪の場合、スクリプトにいくつかのグローバル変数を挿入してピックアップしてください。 –

私はこれを読んで学ぶことができる場所を具体的に知ることができますか？ @goneCoding –

ちょうど経験を伝える。彼らがメンテナンスを難しくしているので、何もしてはいけないことの多くを長年にわたって勉強しました:) –

はい、<script>タグ内にrazorを使用できます。

<script type="text/javascript"> 
    data.addRows([ 
    ['@someRazorString', @someRazorNumber] 
    ]); 
</script>

また、あなたがガイドとして

@{ 
var jsonSerializerSettings = new JsonSerializerSettings { ContractResolver = new CamelCasePropertyNamesContractResolver() }; 
<text> 
    <script type="text/javascript"> 
     var someJsObjectOrArray = @Html.Raw(JsonConvert.SerializeObject(Model.someDotNetObjectOrArray, jsonSerializerSettings))); 
    </script> 
</text> 
}

出典

2017-01-13 15:20:17

ああ、なぜ私はそれをやってみませんでしたか？とにかくありがとう！ –

Javascript（MVCではなく）の中でRazorを使用

答えて

関連する問題