Javascript 在加载程序仍显示时处理HTTP调用和函数调用

我正在使用angularJS并尝试显示Loader（以确保用户在返回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);
            });
        }
    }

---

为此，不应该将AngularJS代码与jQuery代码混用。您应该在ID为imgLoading的元素中使用ng show=“model.isload”，而不是执行$（“#imgLoading”）.show（）。这意味着您应该根据模型的状态隐藏或显示某些内容

考虑到您希望基于运行异步的不同函数显示加载映像，您应该使用这两个变量执行ng show。大概是这样的：

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

---

这样，直到两者都设置为false，加载才会显示。

Small addition：当您想在控制器/组件/指令中使用jQuery时，请使用angular.element而不是$（），我尝试在控制器中添加ng show和assign值，但根本不起作用。我肯定出了什么问题，但我们如何找到它？你是如何设置这些变量的？您是如何设置ng show的？@FranciscoGoldenstein感谢您的回复，我确实使用了ng show=“scf.ShowLoader”，然后将值设置为scf.ShowLoader=true；无论我在哪里需要用jquery代码来替换它，我都能看到它在工作，但是当涉及到在屏幕上不断维护加载程序时，它失败了，当它跳转到函数confirmtenderltlrates时，它会关闭，但您需要检查变量以检查是否要显示加载程序，正如我在回答中所述，每个函数一个。如果在两个函数之间共享同一个变量，则当一个函数完成时，会将其设置为false，并且加载程序将不可见。