Question

我正在尝试使用ng-repeat在单页面上生成多个图表。实现此指令接受图表数据对象如下。

＆＃13;

module.directive('miChart', function () {        
        return {
            restrict: 'E',
            template: '<div></div>',
            scope: {
                chartData: "=value",
                chartObj: "=?"
            },
            replace: true,
            link: function ($scope, $element, $attrs) {
                $scope.$watch('chartData', function (value) {
                    if (!value) {
                        return;
                    }
                    
                    $scope.chartData.chart.renderTo = $scope.chartData.chart.renderTo || $element[0];
                    $scope.chartObj = new Highcharts.Chart($scope.chartData);
                });
            }
        }
    });

＆＃13;

基本的html如下所示。

＆＃13;

<table>
<tr>
  <td>
      <mi-chart value="pieChartData" chart-obj="pieChartObj"></mi-chart>
  </td>
  <td>
      <mi-chart ng-repeat="property in Property.Competitors" value="property.PropertyId" chart-obj="property.PropertyId"></mi-chart>
  </td>
</tr>
</table>

＆＃13;

将值分配给范围的Javascript代码。

＆＃13;

dataPromise.then(function (serverResponse) {
	   
	   var pieChart = serverResponse.data;
	   
	   var pieChartData = getBaseChartData(pieChart.Primary);

	   var chartData = jQuery.extend(true, {}, pieChartData);
	   chartData = jQuery.extend(true, chartData, chartDiff);

	   $scope.pieChartData = chartData;

	   if (pieChart.Competitors.length > 0)
	   {
		   jQuery.each(pieChart.Competitors, function (index, CompData) {
				   
				   var pieChartDataComp = getBaseChartData(CompData);

				   var chartDataComp = jQuery.extend(true, {}, pieChartDataComp);
				   chartDataComp = jQuery.extend(true, chartDataComp, chartDiff);

				   $scope[CompData.PropertyId] = chartDataComp;
			   }
		   });
	   }

   });

＆＃13;

在上面的代码中，我能够用我的指令渲染我的pieChartData。

但是代码在ng-repeat的情况下不起作用，我必须根据＆＃34; Property.Competitors＆＃34;中的值创建动态对象。

我不能在我的情况下使用字符串（@）或单向绑定（＆amp;），因为我必须处理图表（高级图）对象和观看功能。

我在服务端通过服务器端调用分配动态范围值。

任何人都可以帮助我用ng-repeat和指令生成多个图表。

我如何创建动态对象并密切注意？

如何在angularjs指令中传递动态对象

0 个答案: