title: AngularJs http get response is undefined But the data is present inside success function
body: <p>Am new to angular. I have tried to get the json response from http get method.</p>
  
  <p>My code is,</p>
  
  <pre><code>app.factory('getdata', function ($http, $q){
    this.getlist = function(){       
      alert('1');
      return $http.get('http://www.w3schools.com/angular/customers.php',{'Access-Control-Allow-Origin': 'localhost:*'})
      .then(function(response) {
        console.log('response'); console.log(response.data); //I get the correct items, all seems ok here
          alert('2');
          return response.data;
        });            
    }
    return this;
  });
  /* Stream page controller */
  app.controller('streamCtrl', function($scope,getdata, $ionicSlideBoxDelegate, $timeout, $ionicScrollDelegate, $location, $sce){
    $scope.trustSrc = function(src) {
      return $sce.trustAsResourceUrl(src);
    }
    getdata.getlist()
    .then(function(arrItems){
     $scope.sliders = arrItems;         
   });
  alert($scope.sliders);
  </code></pre>
  
  <p>am getting the alert like 1, 'undefined' and 2
  but the $scope.sliders has the data. because It was working once I resize the screen and also I can get correct alert inside the </p>
  
  <pre><code>getdata.getlist().then(function(arrItems) {
    $scope.sliders = arrItems;         
    alert($scope.sliders);
  });
  </code></pre>