从angularjs ajax call

Question

我正在尝试从angularjs $ http服务获取数据，并且在此服务中我使用两个ajax调用（这些调用影响同一页面）但由于第二次调用我的应用程序冻结，直到我没有得到响应呼叫。

这是我的controller.js代码： -

$q.all([
            //first ajax call   
            $http({     
                    method:"post",
                    url:"/catalog.php",  //From here I am fetching one kind of data that I have to show on main page
                    data:parameter,                         
                    headers: {'Content-Type' : 'application/x-www-form-urlencoded'}                     
                }).success(function(data){                              

                    //some conditions to show main page data                                
                    //from here I am showing the content to main page           

                }),     
            ,
        ]).then(function(){                     

                        $timeout(function(){                        

                            //this is the second ajax call to get the another part of data                                  
                            $http({                         
                                    url:"/filter.php",      //second ajax call to get right side filter section data                    
                                    headers: {'Content-Type' : 'application/x-www-form-urlencoded'}                     
                                }).success(function(data){   

                                    //From here I am creating another div on the same page (Large data on the right side of the page)   
                                    //Due to this call my application is getting hanged until the response is completed



                                });                             

                        },100);                                                             

                });

我希望我的应用程序不应该因第二次ajax调用而冻结，而它在第一次ajax调用之后运行。现在第二个ajax调用冻结我的应用程序。

Answer 1

您应该在浏览器中查看开发工具（https://developers.google.com/web/tools/chrome-devtools/），了解正在发生的事情。

打开网络标签。你的http电话应该在那里。

您还可以打开时间线标签，看看通话的哪个部分花了这么长时间。

考虑到您正在加载大量数据，我建议使用无限滚动https://sroze.github.io/ngInfiniteScroll/

如果向下滚动，这只会加载ng-repeat的可见部分，然后加载更多数据。