当列出3时，ANGULARJS结果消失

My query search all the dishes that the restaurant has on it's database.

<?php
include('base.php');
$data = array();
$result = mysql_query("SELECT nombre FROM platos WHERE tipo = 'principal'",$connect);
if(mysql_num_rows($result) > 0){
    while($row = mysql_fetch_assoc($result)){
        $data[] = $row;
    }
} else {
    echo "0 results";
};
echo json_encode($data);
mysql_close($connect);
?>

so then I invoke it on the angular code:

$http({
      method: 'GET',
      url: '../../php/getDishesPrincipal.php'
    }).then(function successCallback(response) {
        $scope.principals = response.data;
    }, function errorCallback(response) {
        $scope.principals = 'No Response';
    });

well, finally i print it on my html code:

<div id="agregarpedido_table_item" ng-repeat="principal in principals">
   <p id="agregarpedido_table_item_p">{{principal.nombre}}</p>
   <div id="agregarpedido_table_item_command">
     <p>{{principal.cant}}</p>
     <div class="selectors">
       <input type="button" value="+" ng-click="principal.cant = principal.cant + 1">
       <input type="button" value="-" ng-click="principal.cant = principal.cant - 1">
     </div>
   </div>

The issue is that when in my database theres more than 2 results that matches tipo: principal, the html disappears and it doesn`t show anything. Worst, the console doesn't throw any error about it as if it is normal. Any ideas?

Because you are only getting back an array of names due to your SQL query, angular may be throwing a no-dupes error inside the ng-repeat.

Try formatting your ng-repeat like this: ng-repeat="principal in principals track by $index"

you may have 2 or more non-unique names for your principals, so angular throws a no dupe error. For reference, using the track by $index method can help improve render/binding performance in loops.

here's a jsbin https://jsbin.com/noxawusoqe/2/edit?html,js,console,output

Hope that works

I never found the answer, but the error disappeared alone when i restarted PC.