如何创建对象字面量方法以使用http get 请求获取json 数据？

Question

我被用于获取 json 数据的 http get 方法卡住了。 http get 方法工作正常，它实际上正在获取 json 数据，但我无法将它与对象文字连接。

在这里解释清楚的是我卡住的那段代码。

   var x ={};
  $http.get('chart.json') //reading the studentRecord.json file
         .success 
       (function(data1){
       //alert(data1);
 $scope.x = data1;

       }); 

  var conversionChart = new FusionCharts({
    type: 'funnel',
    renderAt: 'chart-container',
    width: "100%",
    dataFormat: 'json',
    dataSource: x

 });

我正在尝试将 http.get 方法应用于 dataSource: 以获取 json 数据，但是它不起作用。我的主要任务是将 http.get 请求应用于 dataSource:，这使我的代码正常工作。

让我给你完整的代码，以便你更好地理解。

index.html

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>FusionCharts - Funnel 3D Chart</title>




  <link rel="stylesheet" type="text/css" href="/css/result-light.css">
  <link rel="stylesheet" type="text/css" href="/css/normalize.css">

      <script data-require="angular.js@1.4.0-beta.6" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script> 
      <script type='text/javascript' src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
      <script type='text/javascript' src="http://static.fusioncharts.com/code/latest/fusioncharts.widgets.js"></script>
      <script type='text/javascript' src='/js/lib/dummy.js'></script>
      <script type='text/javascript' src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
      <script src="script.js"></script>







</head>
<body ng-app="myApp">
  <!-- A funnel 3D Chart showing a conversion analysis in percentage of visiting to purchase in Harry's Supermart website last year 

Attribute :
# showPercentValues - set to 1 to show the values in percentage.

-->

<div id="chart-container" ng-controller="ParentCtrl"  ng-init='load()' ng-model="dataSource1">FusionCharts will render here</div>

</body>


</html>

script.js

var myApp = angular.module("myApp", []);


//The below code will read the data from student.json file and will pass to the $scope variable 
 myApp.controller("ParentCtrl", function($scope, $http)
  {   

 $scope.load = function(){
     //alert("2");
    FusionCharts.ready(function () {
      //alert("1");
   var conversionChart = new FusionCharts({
        type: 'funnel',
        renderAt: 'chart-container',
        width: "100%",
        dataFormat: 'json',
        dataSource : function(){



      $http.get('chart.json') //reading the studentRecord.json file
            .success 
        (function(data1){
        alert(data1);
       $scope.dataSource = data1;// binding the data to the $scope variable
 }); 

        }

   });



conversionChart.render();

});

};
});

chart.json

{ 

            "chart": {
                        "caption": "Ensource sales report",
                        "subcaption": "Purchase - Conversion analysis for last year",
                        "decimals": "1",
                        "isHollow": "0",
                        "isSliced": "1",
                        "labelDistance": "15",
                        "plotTooltext": "Success : $percentOfPrevValue",
                        "theme": "fint",
                        "baseFontSize":"18"
            },
                "data": 
                [

                                        {
                                            "label": "Total",
                                            "value": "385634"
                                        },
                                        {
                                            "label": "Contacts",
                                            "value": "175631"
                                        },
                                        {
                                            "label": "Leads",
                                            "value": "84564"
                                        },
                                        {
                                            "label": "Sanctioned",
                                            "value": "35654"
                                        },
                                         {
                                            "label": "Disbursed",
                                            "value": "12342"
                                        }

            ]





}

我的主要目的是使用http.get方法来获取json数据到

dataSource :

笨蛋：http://plnkr.co/edit/HUKvROQv8wIiFfx6uZBk?p=preview

如果有人帮助我，我将非常感激。请帮助我，因为我是 angular

的新蜜蜂

Answer 1

根据你的 plunker，代码应该是：

var myApp = angular.module("myApp", []); 


//The below code will read the data from student.json file and will pass to the $scope variable 
myApp.controller("ParentCtrl", function($scope, $http) 
{ 

$scope.load = function(){ 
//alert("2"); 
FusionCharts.ready(function () { 
//alert("1"); 
var conversionChart; 
$http.get('chart.json') //reading the studentRecord.json file 
.success 
(function(data1){ 
//alert(data1); 
$scope.dataSource = data1;// binding the data to the $scope variable 
conversionChart = new FusionCharts({ 
type: 'funnel', 
renderAt: 'chart-container', 
width: "100%", 
dataFormat: 'json', 
dataSource : $scope.dataSource 

}); 



conversionChart.render(); 

}); 

}); 

}; 
});

如何创建对象字面量方法以使用http get 请求获取json 数据？

How to create the object literal method to use the http get request to get the json data?

html

json

get

angularjs