带有$ q.all的googleChartApiPromise给出错误“图表类型未定义”。

Question

我正在尝试将angular-google-charts与$http服务一起使用来获取数据并填充图表。为此我遵循了这篇博文中的教程：http://nicholasbering.ca/angularjs/2015/04/02/google-charts-api-promise/因为angular-google-charts的github自述文件没有显示后端数据服务的示例。

我收到了这个错误：

function SomeCtrl(
  $scope,
  $log,
  $stateParams,
  googleChartApiPromise,
  $http,
  $q) {

    googleChartApiPromise.then(function() {

      $scope.goodsAndServicesChartObject = {};

      init();

      function init() {
        var dataPromise = $http.get('businesses/' + $stateParams.businessId + '/contact_users/gender');

        $q.all({
            data: dataPromise,
            api: googleChartApiPromise
          })
          .then(apiLoadSuccess);
      }

      function apiLoadSuccess(result) {
        $scope.goodsAndServicesChartObject.type = 'PieChart';
        $scope.goodsAndServicesChartObject.options = {
          'title': 'Goods Vs Services'
        };
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('number', 'Value');
        data.addRows(result.data.data);

        $scope.goodsAndServicesChartObject.data = data;

      }
    });
  }

有时它会在googleChartApiPromise不是undefined时加载图片。

我想知道为什么googleChartApiPromise有时会被定义为未定义？

Answer 1

显然我问了存储库所有者并且发现我忘了使用ng-if来隐藏图表（如果它没有加载）并在加载数据时启用它。

此外，我们也不必使用googleChartApiPromise.then，因为它已经包含在api: googleChartApiPromise中。只需为ng-if定义变量即可解决问题。

完整的讨论在这里：https://github.com/angular-google-chart/angular-google-chart/issues/208