Angular：如何阻止我的$ http调用阻止UI？

问题描述：

在我的控制，我有以下代码：

PartnersService.GetNonPartnerBanks().success(function (data) { 
     vm.nonPartnerBanksList = data; 
    }).error(function() { 
     vm.nonPartnerBanksList = []; 
    });

调用该服务：

service.GetNonPartnerBanks = function() { 
      var nonPartnerBankUrl = config.baseUrl + 'public/nonPartnerBanks'; 
      return $http.get(nonPartnerBankUrl); 
     };

这所有的作品，但如果服务器需要更长的时间来回复，该应用程序的UI冻结了。

我做错了什么不是$http服务使用AJAX和承诺，以便在调用进行时UI的呈现应该继续？

的模板，它使用数据的部分：

<ol class="nya-bs-select nya-dashboard" 
    required 

    name="futurePartner" 
    id="futurePartner" 
    ng-model="npc.futurePartner" 
    data-size="5" 
    ng-change="npc.hideSucessMessage()" 
    title-tpl="<span>{{npc.partnerSelectTitle}}</span>" 
    deep-watch="true" 
    no-search-title-tpl="<span>{{'general.NoSearchResult' | translate}}</span>" 
    data-live-search="true"> 
    <li nya-bs-option="bankItem in npc.futurePartnerList" data-value="bankItem.id"> 
     <a> 
      {{bankItem.name}} 
     </a> 
    </li> 
</ol>

追问：

Vita的回答让我在正确的线索，这不是说$ HTTP挡住了我的UI，我有ajax电话上的动画给人留下了Ui冻结的印象

答

$ http调用是异步的，它返回promise，你可以使用.then和.catch作为它的唯一对象（成功和错误的回调函数仅用于历史原因，他们被弃用）

但即使他们没有阻止你的用户界面，它必须是不同的东西。

“冻结”是什么意思？

从哪里调用该方法？你在route obejct resolve属性中使用它吗？如果是 - 那么它的特点 - 它等待所有承诺全部完成。

Definitelly问题在别的地方。你能提供更多的信息吗？或者甚至更好一些jsbin？

在我的情况下，冻结意味着屏幕是完全白色的，我使用数据填充一些下拉列表（nya-bs-select），我没有使用路由解析。 –

我已经添加了虚拟机正在馈送的视图部分，下拉列表，但我无法发布一个更大的示例，因为它是巨大的控制器/视图（我无法拆分）的一部分 –

嗯，我不知道这个指令的内部结构......但是，数组中有多少项？项目本身有多大？（有没有名称和ID或更多？以及究竟是什么“深度观察”（它不在nya-bs选择文档中，所以我想它是你的）。我正在考虑缓慢渲染你有ng-stats的项目，它可以告诉你，有多少观察者和多长时间的摘要循环，所以如果没有一些手表需要太多的时间，我真的不能在第一眼看到任何奇怪的东西，但我会说你的控制器不应该是巨大的：/ –

Angular：如何阻止我的$ http调用阻止UI？

相关推荐