Jia*_*ing 5 javascript .net-core chart.js asp.net-core
我在将模型对象传递给 .cshtml(asp.net Core项目)中的 javascript 函数时遇到问题。我做了很多搜索,但找不到解决这个问题的方法。我使用 ChartJs 行示例构建了一个 Web 应用程序。
.cshtml 文件中有一个 js 函数,
<script>
document.getElementById('addData').addEventListener('click', function() {
if (config.data.datasets.length > 0) {
var month = MONTHS[config.data.labels.length % MONTHS.length];
config.data.labels.push(month);
config.data.datasets.forEach(function(dataset) {
dataset.data.push(randomScalingFactor());
});
window.myLine.update();
}
});
</script>Run Code Online (Sandbox Code Playgroud)
我是 ASP.NET Core 和 js 的新手。如果有办法将数据从模型添加到 js 函数?谢谢!
解决方案:
模型:
public class SalesViewModel
{
public string salesdate { get; set; }
public int salesprice { get; set; }
}
Run Code Online (Sandbox Code Playgroud)
数据:
public class SalesContext
{
public string ConnectionString { get; set; }
public SalesContext(string connectionString)
{
this.ConnectionString = connectionString;
}
public SalesContext()
{
}
public List<SalesViewModel> GetAllData()
{
List<SalesViewModel> list = new List<SalesViewModel>();
list.Add(new SalesViewModel() { salesdate = "1", salesprice = 3 });
list.Add(new SalesViewModel() { salesdate = "2", salesprice = 6 });
list.Add(new SalesViewModel() { salesdate = "3", salesprice = 7 });
list.Add(new SalesViewModel() { salesdate = "4", salesprice = 2 });
list.Add(new SalesViewModel() { salesdate = "5", salesprice = 1 });
return list;
}
}
Run Code Online (Sandbox Code Playgroud)
控制器:
using Newtonsoft.Json;
public IActionResult Chart()
{
SalesContext sc = new SalesContext();
string json = JsonConvert.SerializeObject(sc.GetAllData());
//ViewData["chart"] = json;
ViewBag.Sales = json;
return View(sc.GetAllData());
}
Run Code Online (Sandbox Code Playgroud)
看法:
document.getElementById('addData').addEventListener('click', function() {
if (config.data.datasets.length > 0) {
var salesdata = @Html.Raw(ViewBag.Sales);
config.data.datasets.forEach(function(dataset) {
for (var i = 0; i < salesdata.length; i++) {
var month = MONTHS[config.data.labels.length % MONTHS.length];
config.data.labels.push(month);
dataset.data.push(salesdata[i].salesprice);
}
});
window.myLine.update();
}
});
Run Code Online (Sandbox Code Playgroud)
用于var salesdata = @Html.Raw(ViewBag.Sales)从控制器获取数据!
用于salesdata[i].salesprice将数据推送到数据集!
谢谢!
| 归档时间: |
|
| 查看次数: |
3447 次 |
| 最近记录: |