将 $scope 传递给另一个 $controller（在 AngularJS 中使用 Google 图表）

Question

我是 AngularJS 的新手。我正在编写一个政治测验。一切正常，但我无法将值包含在 Google 图表中。

我读到我可以使用 "services" 将范围传递给另一个控制器，但它不起作用。

这是代码

var aritmetica = angular.module('aritmetica', ['ngAnimate']);

aritmetica.factory("contadoreco",function(){
        return {};
});

aritmetica.factory("contadorsoc",function(){
        return {};
});

aritmetica.controller('encuestaController',  ['$scope', function($scope,contadoreco,contadorsoc) {
  $scope.contadoreco= 0;
  $scope.contadorsoc= 0;
  $scope.pageClass = 'encuesta';
  $scope.sumareco = function(cantidad) { $scope.contadoreco += cantidad};
  $scope.restareco = function(cantidad) { $scope.contadoreco -= cantidad};
  $scope.sumarsoc = function(cantidad) { $scope.contadorsoc += cantidad};
  $scope.restarsoc = function(cantidad) { $scope.contadorsoc -= cantidad};
}]);

aritmetica.controller('MyCtrl', function($scope,contadoreco,contadorsoc) {
      $scope.name = "Name"
});

aritmetica.directive('chart', function($scope,contadoreco,contadorsoc) {
    return {
        restrict: 'A',

        link: function($scope, $elm, $attr) {
          // Create the data table.
          var data = google.visualization.arrayToDataTable([
              ['Económico', 'Social'],
              [$scope.contadoreco, $scope.contadorsoc]
          ]);

          var options = {
              title: 'Age of sugar maples vs. trunk diameter, in inches',
              hAxis: {title: 'Económico', minValue: -130, maxValue: 130},
              vAxis: {title: 'Social', minValue: -130, maxValue: 130},
              legend: 'none',
              width: 400,
              height:400,
          };

          // Instantiate and draw our chart, passing in some options.
          var chart = new google.visualization.ScatterChart($elm[0]);
          chart.draw(data, options);
        }
    }
  });

  google.setOnLoadCallback(function() {
      angular.bootstrap(document.body, ['myApp']);
  });

  google.load('visualization', '1', {packages: ['corechart']});

Answer 1

好吧，我看到的一个问题是您没有将服务正确定义为依赖项。你错过了字符串 'contadoreco', 'contadorsoc' 所以它们不会被注入你的控制器。应该是这样的：

aritmetica.controller('encuestaController',  ['$scope', 'contadoreco', 'contadorsoc', function($scope, contadoreco, contadorsoc) {
// etc...
}]);

有两种不同的方式来注入依赖项。就像我在上面发布的或您在此处所做的那样：

aritmetica.controller('MyCtrl', function($scope, contadoreco, contadorsoc) {

});

如果代码被缩小，第二个将不起作用，第一个可以。

Answer 2

从控制器中的任何地方将范围传递给服务。确保注入服务。

controllersModule.controller('MyCtrl', function($scope, $filter, $http, $compile, ngTableParams, **FactoryYouwant**) 
    {

        **FactoryYouwant**.getdata($scope.**scopeYoutwantTopass**).then (function(responseData){    
        var ResponseFromServer =responseData.data;
    }

在役

controllersModule.factory('**FactoryYouwant**, function($http) {
    var responseData = null;

    return {
        getdata : function(**data**){     (you dont have to use $)                  
            responseData = $http.post or whatever actually gets you data;
            return responseData;
        }

      };
});

希望对您有所帮助。

将 $scope 传递给另一个 $controller（在 AngularJS 中使用 Google 图表）

passing $scope to another $controller (using Google Charts in AngularJS)

charts

scope

controller

angularjs