Angular Treemap с передачей данных из сервиса

Хорошо, позвольте мне переписать несколько вещей для вас, чтобы вы могли попробовать и сообщить мне, все ли в порядке:

 //service    
 app.service('grabdata', function($http, $q){
  var data = [];
  return({
     getData:getData
  });

 function getData(){
   var defer = $q.defer();
   $http.get('someApi').then(function success(response){
   var company = [];
   var wtdCagr = [];
   var children = [];
   for(var i=0;i<response.data.length;i++){
     company.push(response.data[i].companies);
     wtdCagr.push(response.data[i].wtdcagr);
     children.push({name:response.data[i].companies, value: 3241});
   }
   data.push({name:"flare", children:children});
   defer.resolve(data[0]);
   return defer.promise;
 }
});



//controller
 app.controller('myController', ['$scope', '$http','grabdata', function($scope, $http, grabdata) {
    var $scope.data = [];
    grabdata.getData().then(function(response){
        $scope.data = response;
    });
    $scope.$watch($scope.data, function(newData,oldData){
       if(newData !== oldData){//workout some logic since this is array or object ??
           $scope.data = newData;
       }
    }, true);

 }]);

$ http service call is async, и вам нужно вернуть обещание стороне, которая заинтересована в данных, и когда обещание будет разрешено, вы получите свои данные. Я не понял, почему длина вашего объекта не определена, просто убедитесь, что присутствует response.data. Я бы посоветовал прочитать информацию об обработке данных async, ваша жизнь будет проще. Вы также можете вернуть $ http.get('/someapi') и обрабатывать данные в контроллере, если это так, как вы хотите это сделать