使用 MVC/Razor 传递 C# 变量以用于 Dygraph

Question

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

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

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

}

我想将这个“数据”变量传递给一个非常小的脚本，以便使用 Dygraph 创建一个图形。这是我目前拥有的，并且相信应该可以，但它没有。

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

我知道脚本本身会起作用。如果我将一些 CSV 值硬编码到 @data 所在的字符串中，则会弹出图表并且一切都很好。有了@data，图表不会加载，脚本根本不会运行（我在其中放置了一个 alert('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# 创建的“数据”变量为其提供信息的方式）。

我必须在 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');

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