使用MVC/Razor传递c#变量以便与Dygraph一起使用

本文关键字:Dygraph 一起 变量 MVC Razor 传递 使用 | 更新日期: 2023-09-27 18:13:35

所以这是我的问题,我相信这是非常简单的东西。我对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,图形不会加载,脚本根本不会运行(我在那里放置了一个警报('hi'),看看它是否会弹出,它没有)。

此外,我知道字符串正在正确地"构建",因为我已经在Visual Studio中设置了断点并检查了。

任何帮助都将是伟大的家伙。

使用MVC/Razor传递c#变量以便与Dygraph一起使用

混合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>

查看混合Razor和Javascript代码

我发现了这个问题。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');

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