Переменная диапазона AngularJS не установлена ​​в рамках обещания

Question

У меня есть этот код, который я использую с CartoDB. Предположим, чтобы запустить запрос, используя их библиотеку JS, а затем вернуть некоторые данные. Я добавляю некоторые результаты , и он работает внутри функции done(). Хотя второй я пытаюсь использовать/задавать результат как переменную области видимости в AngularJS, я ее теряю. Вот пример кода. EDIT: Мои извинения, «does not work» означает, что я всегда получаю значение по умолчанию mvcTotal = 0, isntead того, что вычисляется внутри JS.

angular.module('angMvcApp') 
    .controller('DataCtrl', ['$scope', '$routeParams', function ($scope, $routeParams) { 
    var borough = $routeParams.borough; 

    var sql = new cartodb.SQL({user: 'wkaravites'}); 
    var table = 'qiz3_axqb'; 
    var mvcTotal = 0; 

    if (borough != null) { 
     $scope.borough = borough; 
    } else { 
     $scope.borough = "Data Overview"; 

     sql.execute("select borough, count(*) from qiz3_axqb group by borough") 
     .done(function (data) { 
      $.each(data.rows, function (index, value) { 
      console.log("pizza: " +value['count']); 
      mvcTotal += value['count']; 
      //$('#' + value['borough'] + '').text(value['count']); 
      //$('#boroughList').append('<h2>' + value['borough'] + '</h2>'); 

      }); 
      //I see this correct 
      console.log(mvcTotal +" totals"); 

      //This doesn't work 
      $scope.mvcTotal = mvcTotal; 

     }) 
     .error(function (errors) { 
      // errors contains a list of errors 
      console.log("errors:" + errors); 
     }); 
     console.log(mvcTotal+" test test"); 

     //This doesn't work 
     $scope.mvcTotal = mvcTotal; 

     //This works 
     #scope.mvcTotal = 57; 

    } 


    }]); 

Я как-то возился с тем, как я переводил регулярную переменную в переменную с угловым пространством? Когда я проверяю консоль JS, я вижу журнал с пиццей в нем И правильный номер с «итоговыми» добавленными до конца.

Вот вид HTML:

<div class="container"> 
    <div class="row"> 
    <div class="col-lg-12"> 
     <h1>{{borough}}</h1> 
     <p>{{mvcTotal}} motor vehicle collisions</p> 
    </div> 
    </div> 
</div> 

Answer 1

Все, что вы хотите сделать с данными, возвращенных из вашей БД вызова должно быть сделано ВНУТРИ проделанной функция. Я думаю, вы это понимаете, но то, что вам не хватает, это порядок операций. Используйте отладчик, чтобы увидеть фактический порядок, в котором выполняется код:

var sql = new cartodb.SQL({user: 'wkaravites'}); 

//step #1 
var mvcTotal = 0; 

    //step #2 
    sql.execute("select borough, count(*) from qiz3_axqb group by borough") 
    .done(function (data) { 
     //step #6 finally after DB responds this is called. mvcTotal is still 0 
     //$scope.mvcTotal is 57 
     $.each(data.rows, function (index, value) { 
     console.log("pizza: " +value['count']); 
     mvcTotal += value['count']; 


     }); 
     //step #7 now you get the correct total 
     console.log(mvcTotal +" totals"); 

     //step #8 this is correct. you can display this value in your html view as {{mvcTotal}} 
     $scope.mvcTotal = mvcTotal; 

    }) 


    //step #3 mvcTotal is still 0 
    console.log(mvcTotal+" test test"); 


    //step #4 mvcTotal is still 0 since DB call has not finished 
    $scope.mvcTotal = mvcTotal; 

    //step #5 previous value was 0, now it's 57 
    $scope.mvcTotal = 57;