$http.get failing to retrieve data from PHP backend

AngularJS, PHP, and MySQL: changing ng-repeat data on ng-change

I’ven been working on a web-base system and ng-repeat seems to have error on duplicate keys and I don’t know what to do. The selectall brand seems working fine but the php code I paste below seems doesn’t work and the “track by $index”. the code below only display infinite loop or rows in the table

html code

<div class="card-body p-0">
      <!-- DataTales Example -->
      <div class="card shadow mb-4" style="font-size: 0.75rem">
        <div class="card-header py-2">
          <h6 class="m-0 font-weight-bold text-green">Category of {{selectedBrand}}</h6>
        </div>
        <div class="card-body">
          <div class="table-responsive col-xl-12 col-lg-12 col-xl-12"
               ng-disabled="disableTable">
            <table class="table-letters-lg table-hover" id="dataTable" width="0%" cellspacing="0">
              <thead>
                <tr class="bg-gradient-primary" style="color: white">
                  <th>Category ID</th>
                  <th>Category Name</th>
                  <th>Category Code</th>
                </tr>
              </thead>
              <tbody>
                <tr style="cursor: pointer" ng-repeat="categories in prodcategory">
                  <td>{{categories.category_id}}</td>
                  <td>{{categories.category_name}}</td>
                  <td>{{categories.category_code}}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>

    </div>
</div>

angularjs code

$http.get('database/prodcategory/selectallbrandname_category.php')
  .then(function(z){
    $scope.prodbrand_category = z.data;
});
                        
$http.get('database/prodcategory/selectallbrand_category.php')
  .then(function(y){
    $scope.prodcategory = y.data;
});

$scope.selectBrand = function() {
    if($scope.selectedBrand == "All Brands") {
        $scope.showAllCategoryList();
    }

    else {
        var b_name = $scope.selectedBrand;
        $scope.showBrandCategoryList(b_name);
    }
}
$scope.showAllCategoryList = function() {
    $http.get('database/prodcategory/selectallbrand_category.php')
      .then(function(response){
        $scope.prodcategory = response.data;
    });
}

$scope.showBrandCategoryList = function(brand_name) {
    $http.get('database/prodcategory/selectbrand_category.php', {brand_name: brand_name})
      .then(function(x){
        $scope.prodcategory = x.data;
    });
}

php code

<?php
    require_once '..connect.php';
    $data = json_decode(file_get_contents("php://input"));
    $brand_name = $data->brand_name;

    try {
        $stmt = $pdo->prepare("SELECT * FROM `prodcategory` INNER JOIN `prodbrand` ON `category_brandid` = `brand_id` WHERE `brand_name` = ?");

        $stmt -> execute([$brand_name]);
  
        $data = $stmt->fetchAll(PDO::FETCH_ASSOC);
        echo json_encode($data);
    }catch (Exception $e){
        echo $e;
        $pdo->rollback();
        throw $e;
    }
?>

Answer

One of the $http.get operations is malformed.

ERRONEOUS

$scope.showBrandCategoryList = function(brand_name) {
    $http.get('database/prodcategory/selectbrand_category.php', {brand_name: brand_name})
      .then(function(x){
        $scope.prodcategory = x.data;
    });
}

The second argument of the $http.get method does not carry data, it carries the optional config object.

From the Docs:

$http.get(url, [config]);

• url string Absolute or relative URL of the resource that is being requested
• config (optional) Object Optional configuration object. See $http() arguments

— AngularJS $http Service API Reference – $http.get