jQuery优先于脚本

Prioritize the jQuery before script

本文关键字:脚本 优先于 jQuery      更新时间:2023-09-26

我有我的脚本在html文件的问题。问题是关于通过jQuery更新变量,然后从它创建一个图表。

我使用角的图表创建,所以它是不可能把它到不同的jQuery。

部分代码:

var chartData = [];
            $.getJSON('../json/testData.json', function (json) {
                for (var i=0; i < json.length; i++){
                    var j = json[i].Value;
                    chartData.push(j);
                }
            });
angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope) {
            $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
            $scope.series = ['Series A', 'Series B'];
            $scope.data = [
                [65, 59, 80, 81, 56, 55, 40],
                [28, 48, 40, 19, 86, 27, 90],
                chartData
            ];
        });

我想要实现的:从JSON中获取数据,更新chartData,将更新的变量放入图表中。

它现在是如何工作的?->它做了所有的事情,然后是jQuery,所以我在图表中有一个空数组。

我的研究:我试图操纵变量和jQuery的范围。结果还是一样的。当我把所有东西都放到函数中时,angular就不能工作了。

从下面的帖子解决方案:

    angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope, $http) {
        $http.get('../json/testData.json').then(function (response) {
            for (var i = 0; i < response.data.length; i++) {
                var j = response.data[i].Value;
                jsondata.push(j);
            }
        });

为什么不在控制器内部使用$http服务来获取数据,然后将其放在作用域上:

angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope, $http) {
    $scope.data = [];
    $http.get('../json/testData.json').then(function (response) {
        for (var i = 0; i < response.data.length; i++) {
            var j = response.data[i].Value;
            chartData.push(j);
        }
    });
});