Javascript MVC将列表传递给jQuery并提取元素

我需要将列表从MVC控制器传递到视图中的javascript。 这是我的控制器中的方法

    private void PopulateChart() {

        var diagramItem = new DiagramPoll();
        var diagramList = new List<DiagramPoll>();
        diagramItem.Color = "#F7464A";
        diagramItem.Label = "System 1";
        diagramItem.Value = "10";
        diagramList.Add(diagramItem);

        diagramItem.Color = "##FDB45C";
        diagramItem.Label = "System 2";
        diagramItem.Value = "20";
        diagramList.Add(diagramItem);

        ViewBag.MyValues = JsonConvert.SerializeObject(diagramList, Formatting.None);
    }

private void PopulateChart（）{
var diagramItem=new DiagramPoll（）；
var diagramList=新列表（）；
diagratem.Color=“#F7464A”；
diagramItem.Label=“系统1”；
diagramItem.Value=“10”；
diagramList.Add（diagramItem）；
diagramItem.Color=“##FDB45C”；
diagramItem.Label=“系统2”；
diagramItem.Value=“20”；
diagramList.Add（diagramItem）；
ViewBag.MyValues=JsonConvert.SerializeObject（diagramList，Formatting.None）；
}

在视图文件的脚本部分：

    <script>
        $(document).ready(function() {             
            var chartValues = @Html.Raw(ViewBag.MyValues);
        //This is what I would like to do:
        foreach (var item in chartValues) {
              var color = item.Color;
              var label = item.Label;
              var value = item.Value
        }
        });
    </script>

$（文档）.ready（函数（）{
var chartValues=@Html.Raw（ViewBag.MyValues）；
//这就是我想做的：
foreach（chartValues中的var项）{
var color=item.color；
var label=项目标签；
变量值=项目值
}
});

我需要提取上面的变量，将它们作为输入参数发送到jQuery图表

---

谢谢大家!

要将值从视图传递到脚本，需要将其添加到引号中。将脚本更改为如下所示

<script>
    $(document).ready(function() {             
        var chartValues = '@ViewBag.MyValues';

    });
</script>

或

---

但是您必须转换图表值，您可以尝试以下方法：

@model IList<WebApplication2.Models.DiagramPoll>

<script type="text/javascript">
$(document).ready(function() {             
    //This is what I would like to do:
    @foreach (var item in Model) {
        var color = item.Color;
        var label = item.Label;
        var value = item.Value;
    }
});

@model-IList
$（文档）.ready（函数（）{
//这就是我想做的：
@foreach（模型中的var项目）{
var color=item.color；
var label=项目标签；
var值=项目价值；
}
});

public ActionResult About（）
{
var diagramItem=new DiagramPoll（）；
var diagramList=新列表（）；
diagratem.Color=“#F7464A”；
diagramItem.Label=“系统1”；
diagramItem.Value=“10”；
diagramList.Add（diagramItem）；
diagramItem.Color=“##FDB45C”；
diagramItem.Label=“系统2”；
diagramItem.Value=“20”；
diagramList.Add（diagramItem）；
返回视图（图表列表）；
}

您是否会收到任何JavaScript或其他错误？

var chartData = JSON.parse(chartValues);

@model IList<WebApplication2.Models.DiagramPoll>

<script type="text/javascript">
$(document).ready(function() {             
    //This is what I would like to do:
    @foreach (var item in Model) {
        var color = item.Color;
        var label = item.Label;
        var value = item.Value;
    }
});

    public ActionResult About()
    {
        var diagramItem = new DiagramPoll();
        var diagramList = new List<DiagramPoll>();
        diagramItem.Color = "#F7464A";
        diagramItem.Label = "System 1";
        diagramItem.Value = "10";
        diagramList.Add(diagramItem);

        diagramItem.Color = "##FDB45C";
        diagramItem.Label = "System 2";
        diagramItem.Value = "20";
        diagramList.Add(diagramItem);

        return View(diagramList);
    }