Javascript AngularJS代码挂起浏览器

我正在调用一个Web服务，它以HTML响应的形式返回大约3000条记录作为数据条目&我正在尝试使用angularJS读取这个响应

下面是我用来调用服务的AngularJS代码

angular.module('tabApp', ['ngSanitize'])
  .controller('TabController', ['$scope', 'HttpService', function($scope, HttpService) {
        $scope.tab = 0;

        $scope.setTab = function(newTab){
              $scope.tab = newTab;

            $scope.loading = true;
            HttpService.CallService('Service.php?id='+newTab,newTab, function (data) {
                             $scope.myText = data;
                             $('.count').show();
                             $("[id^=searchg]").show();
                             $('.results').show();
            });
        };


        $scope.isSet = function(tabNum){
          return $scope.tab === tabNum;

        };

        $scope.setTab1 = function(newTab1){
            $scope.tab = newTab1;
            $('.loaderImage').hide();
      };



        $scope.isSet1 = function(tabNum){
            return $scope.tab === tabNum;
          };
}])

.service('HttpService', ['$rootScope', '$http', function ($rootScope, $http) {
        $rootScope.loading = true;
        return {
            CallService: function (url,tabnum, callback) {                   
                $http({
                method: "POST",
                url: url,
                data: {id: tabnum}})
                    .success(function (data, status) {                            
                        $('.loaderImage').hide();
                        callback(data, status);
                    }).error(function (data, status) {
                    $('.loaderImage').hide();
                        callback(status);
                    });                 
            } 
        }
    }]);

我的问题是，如果返回的记录超过1500条，浏览器将挂起。请建议我如何改进这一点

更新：

我的html代码如下所示

<div ng-show="isSet(1)">
        <div id=matches  style="display:none"></div>
        <input type=text id=searchg placeholder="Type to search..." style="display:none" />
          <p class="preload" ng-bind-html="myText"></p>
            </div>

我们可以看到，您正试图绑定的是大量数据。将来，它可能会更笨重。 您应该使用服务器端分页，只获取记录的数量，即分页的内容

这里是供参考的

JSFiddle

链接

---

希望这有帮助！为代码干杯！：）

我们可以看到，您正试图绑定的是庞大的数据。将来，它可能会更笨重。 您应该使用服务器端分页，只获取记录的数量，即分页的内容

这里是供参考的

JSFiddle

链接

---

希望这有帮助！为代码干杯！：）

正如@Mohit Dixit所建议的，您应该更愿意进行服务器端分页，并且只请求活动页面记录

我建议您为此使用智能表库。是相同的官方网站。它们支持分页（服务器端和客户端）、一次过滤和排序

---

请注意，有许多库可用于此目的，但我建议这样做，因为我在过去几年中一直在使用它。

正如@Mohit Dixit建议的那样，您应该更喜欢服务器端分页，只请求活动页面记录

我建议您为此使用智能表库。是相同的官方网站。它们支持分页（服务器端和客户端）、一次过滤和排序

---

请注意，有许多库可用于此目的，但我建议这样做，因为我在过去几年中一直在使用它。

您是否一次处理/显示所有3000条记录？向您的客户端添加分页，并从api中获取10或20条记录。或者您可以延迟加载，在用户滚动页面时获取10条记录。您可以尝试在绑定之前使用

：

来鼓励单向绑定。这可能有助于减少观察者的数量，使您的HTML更快。@GiteshPurbia，我需要在哪里添加此分页。你能给我举个例子吗？.谢谢首先你在你的取回查询中添加skip和limit，你一次只发送10条记录，然后在每次滚动时调用的每次调用中都通过skip和limit。你是否一次处理/显示所有3000条记录？给你的客户端添加分页，然后从你的api中取回10或20条记录。或者您可以延迟加载，在用户滚动页面时获取10条记录。您可以尝试在绑定之前使用

：

来鼓励单向绑定。这可能有助于减少观察者的数量，使您的HTML更快。@GiteshPurbia，我需要在哪里添加此分页。你能给我举个例子吗？.Thanks首先你要在你的取回查询中添加skip和limit，你一次只发送10条记录，然后在每次滚动调用的调用中传递skip和limit。