在 DevExtreme Widgets 中使用存储在 $scope 中的数据

Use data stored in $scope in DevExtreme Widgets

本文关键字:scope 数据 DevExtreme Widgets 存储      更新时间:2023-09-26

我现在的代码非常简单。在我的脚本中.js我有:

var myApp = angular.module('myApp', ['dx']);
myApp.controller("defaultCtrl", function ($scope, $http) {
    $http.get("test.json").success(function (response) {
        $scope.data = response;
});
console.log($scope.data);//This shows "undefined"
$(function () {
    $("#gauge").dxCircularGauge({
        rangeContainer: {backgroundColor: 'peachpuff'},
        valueIndicator: {color: 'palegoldenrod'},
        value: 32,
        title: $scope.data[0].title,
        animation: {
            easing: 'linear',
            duration: 750
        }
     })
   });
});

然后在我的 Html 文件中,我有一个基本的 AngularJS 模块。

<body ng-controller="defaultCtrl">
    <div id = "gauge">
    </div>
</body>

我需要从 json 文件中读取设置,并从这些设置生成图形。但是,我被困住了。任何帮助将不胜感激。请不要告诉我不要使用AngularJS或DevExtreme。

这是一个

转折的问题。因此,最初没有定义$scope.data,您尝试将其绑定到小部件。

绑定成功中的数据,否则您就是$q承诺 API

$scope.BindWidget = function(data){
  $("#gauge").dxCircularGauge({
        rangeContainer: {backgroundColor: 'peachpuff'},
        valueIndicator: {color: 'palegoldenrod'},
        value: 32,
        title: data[0].title,
        animation: {
            easing: 'linear',
            duration: 750
        }
     })
   });
}
$http.get("test.json").success(function (response) {
       $scope.BindWidget(response);
});
当然,您

有这个问题,因为您没有以角度方式使用小部件。即使我提供了这个答案,我强烈建议您将方法更改为DevExpress推荐的正确方式。

在这里,您可以找到有关如何以角度方式使用量规控件的更多信息,以便它响应范围变化并成为摘要周期的一部分