Question

所以这是我的问题，我相信这很简单。我对Web开发比较陌生，而且我遇到了一个我无法弄清楚的问题。

我在MVC视图中有这段代码。。

@{
var data = "";
var count = 1;
foreach (var item in ViewModel.Data)
{
    data += count.ToString() + "," + item.Reading.ToString() + "\n";
    count++;
}

}

我想将这个'data'变量传递给一个非常小的脚本，以便使用Dygraph创建一个图形。这就是我现在所拥有的，相信应该有效，但事实并非如此。

<script type="text/javascript">
g = new Dygraph(document.getElementById("readingGraph"), @data,{ labels: ["Sample Number", "Reading"] });
</script>

我知道脚本本身会起作用。如果我将某些CSV值硬编码到@data所在的字符串中，则会弹出图形并且一切正常。使用@data，图表不会加载，脚本根本不会运行（我在那里放置一个警告（'hi'）以查看它是否会弹出，但它没有。）

此外，我知道字符串正在“正确构建”，因为我在Visual Studio中设置了断点并进行了检查。

任何帮助都会很棒。提前谢谢。

Answer 1

混合使用javascript和Razor要求您使用任何代码块包围Razor调用

@{ ... }或@if(condition){}等

并将代码本身放在转义序列中

@:或<text>代码。

所以，知道这一点，你可以做类似

的事情

<script>
    var jsData = '';
    @{
        <text>
            jsData = '@data';
        </text>
     }

     g = new Dygraph(document.getElementById("readingGraph"), jsData,{ labels: ["Sample Number", "Reading"] });

</script>

退房 Mix Razor and Javascript code 和Using Razor within JavaScript

Answer 2

我发现了这个问题。 JS文字字符串不能跨越多行（这就是我通过C＃创建的'data'变量提供信息的方式）。

我必须在C＃代码中添加一个'@'才能将其转换为字符串文字。。

foreach (var item in CompletePreview.BatteryData)
{
    data += count.ToString() + "," + item.Voltage + @"\n"; //note the new @ in front of "\n"
    count++;
}

必须更改脚本以将文字'\ n'替换为可在JS中分解的文字。

g = new Dygraph(document.getElementById("voltGraph"), jsgraphData.replace('\n','\n'), { labels: ["Sample Number", "Voltage"] });
alert('graphs should follow');

感谢大家的帮助。我非常感激。

使用MVC / Razor传递C＃变量以与Dygraph一起使用

2 个答案: