ローダーがまだ表示されている間にHTTP呼び出しと関数呼び出しを処理する

Question

私はangularJSを使用しています。ローダーを表示しようとしています（HTTP呼び出しが結果とともに返されるまで何もクリックしないようにします）。

問題は、間に呼び出されているローダーが消滅するため、関数がまだ実行中に何かをクリックできるようにすることです。

if (response.data[0].projectionType == "LTLRate") { 
        scf.ConfirmTenderLTLRates(scf.confirmTenderLTLTenderId, scf.SelectedOrderDetails.TLOrderId); 
       } 

scf.ConfirmTenderLTLRates = function (TenderId, TLOrderId) { 
     $("#imgLoading").show(); //Am TRYING to keep the loader running, but fails 
     if (TenderId > 0) { 
      var requestData = { 
       Id: TenderId, 
       shipmentId: TLOrderId, 
       PROWithTenderConfirm: scf.PROWithTenderConfirm 
      }; 
      ShipmentService.confirmTender(requestData).then(function (response) { 
       $("#imgLoading").show(); 
       if (response.data.Id != null) 
        if (response.data.Id > 0) { 
         scf.SelectedOrderDetails.FreightCharges = parseFloat(response.data.markupTotal).toFixed(2); 
        } 
       $('#ShipmentTenderingGrid').data('kendoGrid').dataSource.read(); 
       SweetAlert.swal("Tender Confirmed Successfully!", "", "success"); 
       scf.editShipment(TLOrderId, 1); 
      }); 
     } 
    } 

Answer 1

AngularJSコードとjQueryコードを混同しないでください。 $（ "＃imgLoading"）の代わりにshow（）を実行すると、ID imgLoadingの要素でng-show = "model.isLoading"を使用する必要があります。つまり、モデルの状態に何かを隠すか、何かを示す必要があります。

asyncを実行するさまざまな関数に基づいて読み込みイメージを表示することを考慮すると、両方の変数でng-showを実行する必要があります。このようなもの：

ng-show="model.isLoading || model.isLoadingOtherStuff" 

こうして、両方がfalseに設定されるまで、読み込みが表示されます。