过滤器功能在使用 Angular.js.and PHP 时无法按预期工作

我有一个问题。我需要使用 restaurant name 使用 Angular.js 从表中过滤数据。我有一个搜索框。如果用户键入名称的第一个字母，则应筛选与该字母相关的所有名称。它不是那样发生的。我在下面解释我的代码。

<div class="input-group" style="margin-bottom:10px; width:300px;">
<input class="form-control" placeholder="Type Restaurant Name" name="q" type="text" ng-model="searchProduct.rest_name">
</div>
<table class="table table-bordered table-striped table-hover" id="dataTable" >
<thead>
<tr>
<th>Sl. No</th>
<th>Restaurant Name</th>
</tr>
</thead>
<tbody id="detailsstockid">
   <tr dir-paginate="cus in ($parent.labelResults=(listOfCustomerData  | filter:searchProduct.rest_name:startsWith | orderBy:'rest_name')) | itemsPerPage:5 track by $index" current-page="currentPage">
  <td>{{itemsPerPage *(currentPage-1)+$index+1}}</td>
   <td>{{cus.rest_name}}</td>
</tr>
</tbody>
</table>

我的控制器端代码如下。

$http({
        method:'GET',
        url:"php/customerInfo.php?action=disp",
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    }).then(function successCallback(response){
        console.log('res',response.data);
        $scope.listOfCustomerData=response.data;
    },function errorCallback(response) {
    })
$scope.startsWith = function (actual, expected) {
    var lowerStr = (actual + "").toLowerCase();
    return lowerStr.indexOf(expected.toLowerCase()) === 0;
  }

在这里假设我有很多餐厅名称，如Anjum，A&P Chinese Food Express，Bookers BBQ & Crab Shack，Butcher And The Baker，Cactus Club Stephen Avenue，Cactus Club - Macleod Trail。在这里，当用户仅在搜索框中键入名称时，名称以应该过滤器开头，但不会那样发生。如果我将静态值分配给对象$scope.listOfCustomerData则此功能按预期工作，但我使用 PHP 动态获取数据，但就我而言，它不会那样发生。请帮助我。