返回对象时的角度infdig错误

时间:2015-07-07 10:40:55

标签: javascript html angularjs fusioncharts

我是Angular的新手,我必须将一个对象传入ng-repeat中元素的属性。如果我不使用ajax来获取数据并返回一个普通对象,那么返回新对象时代码工作正常,但是,当我这样做时,我得到一个infdig错误。我的问题是,在下面的代码中执行我正在做的事情的最佳方法是什么,并解决我的infdig错误。非常感谢提前。

ng-repeat中的HTML元素:

<div ng-if="currentView.comparisons !== 'null'">
    <div ng-repeat="comparison in currentView.comparisons track by $index" class="row x-margintop">
     <div class="row x-margintop">
      <div class="col-md-8">
       <fusioncharts width="100%" height="400px" type="column2d" datasource="{{getComparisonChart(comparison)}}"></fusioncharts>
      </div>
    </div>
   </div>
</div>

JS:

 /*Ajax For Getting Comparisons Omitted For Brevity But Comparisons Will Have 
 The Following Properties*/
   var newCompObj = {name: comparison.name, template : comparison.template, dataSource: comparison.dataSource, date: {startDate: null, endDate: null}};
  $scope.currentView.comparisons.push(newCompObj);

$scope.getComparisonChart = function(chart){

//Callback and Other Chart Data Will Vary Based On The Chart Type

if(chart.dataSource === 'SvC'){
var data = [];
/* here I want to make a callback and return some data and have that data as part of the returned object.  I know this code is wrong, but not sure how to do this */
      $http({
  url:'callbacks/chart_data/dogCallback.jsp',
  method: 'GET',
  params: {startDate: chart.startDate, endDate: chart.endDate}
}).success(function(data){
    setData(data);  
});  

function setData(data){     
  return {
    "chart": {
      "caption": "Monthly revenue for last year",
      "subCaption": "Harry's SuperMart",
      "xAxisName": "Month",
      "yAxisName": "Revenues (In USD)",
      "numberPrefix": "$",
      "paletteColors": "#0075c2",
      "bgColor": "#ffffff",
      "borderAlpha": "20",
      "canvasBorderAlpha": "0",
      "usePlotGradientColor": "0",
      "plotBorderAlpha": "10",
      "placevaluesInside": "1",
      "rotatevalues": "1",
      "valueFontColor": "#ffffff",
      "showXAxisLine": "1",
      "xAxisLineColor": "#999999",
      "divlineColor": "#999999",
      "divLineDashed": "1",
      "showAlternateHGridColor": "0",
      "subcaptionFontBold": "0",
      "subcaptionFontSize": "14",
      "theme": "fint"
    },
    "data": data,
  }; 
}  
};

问题是我可能有很多的融合图,所以我不会为每一个都有$ scope.var。用户可以使用该图表类型创建任意数量的图表,并且该类型的每个图表都需要此相同的对象,但将具有不同的数据。我对如何解决这个问题持开放态度。总之,我有一个元素需要一个对象作为其数据源。图表的类型定义了对象和我重复的对象的其他属性,使用ng-repeat定义了必须通过回调返回的数据的参数。我也尝试在对象内部进行内联Ajax调用,但没有成功。

如果您需要更多信息,请与我们联系。

1 个答案:

答案 0 :(得分:0)

最后回到这个问题。不确定这是否会对其他人有所帮助。我最终做的是使用带有空数据对象的对象,然后在ng-repeat完成后设置数据对象。

if(startDate != null && endDate != null && (vsData != null && vsData.length > 0)){
  if(comparison.dataSource === 'svcChart'){
    $http({
      url:'callbacks/chart_data/Sales_StoreVsCountry.jsp',
      method: 'GET',
      params: {store: comparison.store, country: vsData, startDate: startDate, endDate: endDate}
    }).success(function(data){
      var chartObj = $scope.svcChart;
      chartObj.data = data;
      FusionCharts(chartId).setJSONData(chartObj);
    });
  }
}