在angularJs中将ajax响应推送到数组

I have a function with the array objects.

$http({
       method: 'GET',
       url: 'select.php'
     }).then(function success(response) {
          alert(response);
          //$scope.posts=response.data; 
     }, function error(response) {
          // called asynchronously if an error occurs
          // or server returns response with an error status.
     }
);
function store() {    
    this.products = [        
       new product("APL", "Apple", "Eat one every…", 12, 90, 0, 2, 0, 1, 2),
       new product("AVC", "Avocado", "Guacamole…", 16, 90, 0, 1, 1, 1, 2),
       new product("BAN", "Banana", "These are…", 4, 120, 0, 2, 1, 2, 2)           
    ];

}

In the above code we are passing some static data, but instead i am trying to a push some dynamic data which comes from another file as a ajax response.

so how can i make it dynamic. i have tried like this

function store() {
this.products = [    
    //new product("APL", "Apple", "Eat one every…", 12, 90, 0, 2, 0, 1, 2),
    //new product("AVC", "Avocado", "Guacamole…", 16, 90, 0, 1, 1, 1, 2),
    //new product("BAN", "Banana", "These are…", 4, 120, 0, 2, 1, 2, 2)
    $scope.product.push(response.data);
];
}

but its not working. any idea how can i make it?

Refer the below code:

$scope.products = [];
    $http({
                  method: 'GET',
                  url: 'select.php'
                }).then(function success(response) {
                    $scope.store(response.data);
                  }, function error(response) {
                    // called asynchronously if an error occurs
                    // or server returns response with an error status.
                  });

$scope.store = function(data){
  $scope.products.push(data); 
}

Because you want to populate the store with items asynchronously, you need to re-factor the store controller to work with promises:

function storeController($scope, $routeParams, DataService) {

  // get store from service
  ̶$̶s̶c̶o̶p̶e̶.̶s̶t̶o̶r̶e̶ ̶=̶ ̶D̶a̶t̶a̶S̶e̶r̶v̶i̶c̶e̶.̶s̶t̶o̶r̶e̶;̶

  var promise = DataService.getStore();

  promise.then(function(store) {
      $scope.store = store;
      return store;
  }).then(function(store) {
      // use routing to pick the selected product
      var sku = $routeParams.productSku
      if ( sku != null) {
        $scope.product = DataService.getProduct(store, sku);
      };
  });
}

Then DataService needs to return a promise:

storeApp.service("DataService", function($http) {
  ̶v̶a̶r̶ ̶m̶y̶S̶t̶o̶r̶e̶ ̶=̶ ̶n̶e̶w̶ ̶s̶t̶o̶r̶e̶(̶)̶;̶

  ̶t̶h̶i̶s̶.̶s̶t̶o̶r̶e̶ ̶=̶ ̶m̶y̶S̶t̶o̶r̶e̶;̶
  this.getStore = _getStore;
  this.getProduct = _getProduct;

  var dataPromise;
  function _getStore() { 
    if (! dataPromise) {
        dataPromise = getData();
    };   
    return dataPromise.then(function(data) {
       return data.map(item => new product(item));
    });
  }

  function getData() {
    var url = 'select.php';
    return $http.get(url)
      .then(function success(response) {
        return response.data; 
    }).catch(function error(response) {
        // called asynchronously if an error occurs
        console.log("ERROR: ",response.status);
        throw response;
    });
  }

  function _getProduct(products, sku) {
      for (var i = 0; i < products.length; i++) {
        if (products[i].sku == sku)
          return products[i];
      }
      return null;
  }
});

Avoid putting constructor functions such as store on global scope. In addition to cluttering global scope, they can't take advantage of AngularJS services such as $http. Instead encapsulate those functions in AngularJS services which can then inject other services.