JavaScript 数组未初始化

Question

当传递到另一个对象数组时，我遇到了 JavaScript 数组问题。我已经尝试了网上发布的所有内容，但没有任何效果。

在 dataValues[dataValues.length] = (v.potroseno_tekucine); 上从 api 获取数据时出现问题。它与 labelValues 一起使用。当我在循环中提醒数据时，它没问题，但是当需要处理它时，它看起来像是未定义的。但是，例如，当我在 var data 之前警告(dataValues.length)时，它的工作正常。

$(document).ready(function () {
var ctx = document.getElementById("PodrumarstvoDetalji").getContext("2d");
var labelValues = [];
var dataValues = [];
$.ajax({
    url: root + "api/StatistikaApi/GetPodrumarstvoChart/?vinograd_id=10",// + $("#vinograd_id").val(),
    type: "Get",
    contentType: 'json',
    dataType: 'json',
    success: function (data) {
        $.each(data, function (k, v) {
            labelValues[labelValues.length] = v.opis;
            dataValues[dataValues.length] = (v.potroseno_tekucine);
        });
    },
    error: function (msg) { alert(msg); }
});
var data = {
    labels: labelValues,
    datasets: [
        {
            label: "My First dataset",
            fillColor: "rgba(220,220,220,0.2)",
            strokeColor: "rgba(220,220,220,1)",
            pointColor: "rgba(220,220,220,1)",
            pointStrokeColor: "#ddd",
            pointHighlightFill: "#ddd",
            pointHighlightStroke: "rgba(220,220,220,1)",
            data: dataValues
        }/*,
        {
            label: "My Second dataset",
            fillColor: "rgba(151,187,205,0.2)",
            strokeColor: "rgba(151,187,205,1)",
            pointColor: "rgba(151,187,205,1)",
            pointStrokeColor: "#ddd",
            pointHighlightFill: "#ddd",
            pointHighlightStroke: "rgba(151,187,205,1)",
            data: [28, 48, 40, 19, 86, 27, 90]
        }*/
    ]
};


var myLineChart = new Chart(ctx).Line(data);
});

有人可以帮我吗？我尝试过推送、切片、连接，但没有任何结果......

Answer 1

Ajax 调用是异步的...这意味着数据 将在从 Ajax 请求获得任何响应之前设置。

为了解决这个问题，您需要在 ajax 成功回调函数中创建数据:

$.ajax({
    success: function (data) {
        $.each(data, function (k, v) {
            labelValues.push(v.opis);
            dataValues.push(v.potroseno_tekucine);
        });
        var data2 = {
          labels: labelValues,
          //...
        };
        //Insert your logic here to handle data2
    }
});