时间戳

首页 > 解决方案 > 将数据从模型导入视图给我一个我无法解决的错误

c# - 将数据从模型导入视图给我一个我无法解决的错误

问题描述

我有一个模型：

public class ReportViewModel
{
    public int[] Data { get; set; }
    public string[] Labels { get; set; }
}

然后，在控制器中，我获取数据和标签，并将其保存在将发送到视图的模型上：

[HttpGet]
    public async Task<IActionResult> Report()
    {

        ReportingViewModel vm = new ReportingViewModel();
        vm.Data = DataReporting(vm);
        vm.Labels = LabelReporting(vm);
        return View(vm);
    }

数组创建得很完美，因为我已经调试过了，这正是我想要的。

然后我通过@Model.Data 将它们传递给一个Chart.js 图表的视图，但是我在控制台上得到一个错误并且图表没有显示。

<div id="container" class="align-items-center" style="width:75%; margin: 0 auto" ;>
    <canvas id="myChart" width="682" height="340"></canvas>
    <script>
        var colorbarra = Array(78).fill('rgba(54, 162, 235, 0.2)');
        var colorborde = Array(78).fill('rgba(54, 162, 235, 1)');
        var datos = @Model.Data;
        var etiquetas = @Model.Labels ;
        var ctx = document.getElementById("myChart");
        var myChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: etiquetas,
                datasets: [{
                    label: 'Nº de Custodios subidos',
                    data: datos,
                    backgroundColor: colorbarra,
                    borderColor: colorborde,
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero: true
                        }
                    }]
                }
            }
        });
    </script>
</div>

这是我在控制台上遇到的错误： 控制台上的错误

Reporting:188 Uncaught SyntaxError: Unexpected token ]

第 188 行是与 @Model.Data 相关的行

var datos = System.Int32[];

非常感谢您提前。

标签： c#asp.netasp.net-mvcchart.js

解决方案

如果您想将视图模型属性用于 javascript，那么您需要将其转换为，

var datos = JSON.stringify(@Model.Data);
var etiquetas = JSON.stringify(@Model.Labels);

或者你可以使用 

var datos = @Html.Raw(Json.Serialize(@Model.Data));
var etiquetas = @Html.Raw(Json.Serialize(@Model.Labels));

推荐阅读