Angular-js noob - ng-Repeat results blank only sometimes, maybe due to size of result set?

Question

My result set will display when I use URL parameters to filter down the results. So I'm thinking maybe there are too many results being returned?

This page: http://www.longrifle.com/forsale/forsaleitems.html#?categoryID=3&age=Contemporary

uses Json output here: forsaleitems_mysql.php?categoryID=3&age=Contemporary

This works fine, except when I empty the categoryID and age parameters on the html page. The php works fine without these parameters and returns the appropriate json but maybe it's too much data back? Nothing is shown in http://www.longrifle.com/forsale/forsaleitems.html with no query strings.

<div class="bs-component" ng-app="myApp" ng-controller="forsaleitemsCtrl"> 
<table class="table table-striped table-hover">
 <thead>
 <tr>
        <th ng-click="sort('Title')">Title
         <span class="glyphicon sort-icon" ng-show="sortKey=='Title'" ng-class="{'glyphicon-chevron-up':reverse,'glyphicon-chevron-down':!reverse}"></span>
        </th>
  <th ng-click="sort('Price','currency')">Price
         <span class="glyphicon sort-icon" ng-show="sortKey=='Price'" ng-class="{'glyphicon-chevron-up':reverse,'glyphicon-chevron-down':!reverse}"></span>
        </th>
        <th>Pics</th>
        <!--<th>Age</th>-->
    </tr>
    </thead>
    <tbody>
   <tr dir-paginate="x in items|orderBy:sortKey:reverse|filter:search|itemsPerPage:5">
     <td><b>{{ x.Title }}</b><br><br>{{ x.Description }}<br><br>
      <a ng-click="showDetails = ! showDetails">Contact Information</a><br>
        <div ng-class="{ 'hidden': ! showDetails }">
       <span ng-hide="!x.Lastname">{{ x.Firstname }} {{ x.Lastname }}<br></span>
       <span ng-hide="!x.Company">{{ x.Company }}<br></span>       
       <span ng-hide="!x.Email"><a href="mailto:{{ x.Email }}">{{ x.Email }}</a><br></span>
       <span ng-hide="!x.PhoneNumber">{{ x.PhoneNumber }}<br></span>
       <span ng-hide="!x.Address1">{{ x.Address1 }}<br></span>
       <span ng-hide="!x.Address2">{{ x.Address2 }}<br></span>
       <span ng-hide="!x.City">{{ x.City }}, {{ x.State }} {{ x.Zip }}<br></span>
      </div>
     </td>
     <td>{{ x.Price | currency :'$' }}<span ng-if="x.ShippingDisplay > 0"> + shipping</span><br>
      <span ng-if="x.Sold > 0"><font color=red><b>SOLD</b></span>
     </td>
     <td>
     <img ng-if="x.Pic1.length" class="image-zoom" id="{{ x.ID }}" src="/images/showcase/{{ x.Pic1 }}"><br><br>
     <img ng-if="x.Pic2.length" class="image-zoom" id="img-{{ x.ID }}-2" src="/images/showcase/{{ x.Pic2 }}">
     </td>
   </tr> 
</tbody>
</table>

<dir-pagination-controls
       max-size="5"
       direction-links="true"
       boundary-links="true" >
</dir-pagination-controls>

</div>
</td>
          </tr>
                </tbody>
              </table></td>
          </tr>
</table>
<script>
var app = angular.module('myApp', ['angularUtils.directives.dirPagination']);
      
app.controller('forsaleitemsCtrl', function($scope, $http, $location) {
 $scope.categoryID = $location.search()['categoryID'];
 $scope.age = $location.search()['age'];
 if ($scope.categoryID==undefined){$scope.categoryID="";}
 if ($scope.age==undefined){$scope.age="";}
 var path='forsaleitems_mysql.php?categoryID='+$scope.categoryID+'&age='+$scope.age;    
    alert(path);
    $http.get(path)
    .then(function (response) {$scope.items = response.data.records;});
    
    $scope.sort = function(keyname, isCurrency){
     $scope.predicate = keyname;
     $scope.sortKey = keyname;   //set the sortKey to the param passed
     $scope.reverse = !$scope.reverse; //if true make it false and vice versa
     if(angular.isDefined(isCurrency)) {
            angular.forEach($scope.items, function (obj) {
            for(var i in obj )
            {
               if(i == keyname && obj[i] != '') 
                  obj[i] =  parseFloat(obj[i]);       
            }
           });
        }
    }
});

</script>