Javascript 执行函数后将变量设置为false

我有这段代码，在其中我将变量“showLoading”设置为true，以向用户显示页面正在加载。有时加载需要很长时间才能完成。如何在完成加载后将变量再次设置为false？请给我一个简单的方法，因为我几周前就开始编写javascript+了

表格中的HTML：

<th scope="col" data-toggle="tooltip" title="Organize por data!" 
    class="table-pointer" ng-click='sortColumn("DATA_VENDA")'
    ng-class='sortClass("DATA_VENDA")'>
  Data
</th>

---

使现代化 在代码的另一部分中，我这样做了，但我不知道如何应用示例中的函数

$scope.enjuListBackPecafunction = function() {
    $scope.mostrarLoading = true;
    return $scope.enjuListBackPeca = Peca.query({
        dateFromPeca:'20170101',
        dateToPeca:'20180830'
        // dateToPeca: $scope.endDate
    }, function (err, values) {
        $scope.mostrarLoading = false;
        if (err) return err;
        return values
    });
};

---

也许你想有一个承诺来控制“有时需要很长时间才能完成”的过程。让我们来看一个实现异步排序的方法：

var doSortAsync = function(column, order) {
  return new Promise(function(resolve) {
    // ... sending a sort request with column-order params
    // ... getting the result asynchronously
    // ... and calling the resolve method when it is done
    resolve(result);
  })
}

然后，您只需在控制器方法中使用适当的参数调用它：

$scope.sortColumn = function(col) {
  $scope.showLoading = true;
  $scope.column = col;
  if($scope.reverse) {
    $scope.reverse = false;
    $scope.reverseclass = 'arrow-up';
  } else {
    $scope.reverse = true;
    $scope.reverseclass = 'arrow-down';
  }
  doSortAsync(col, $scope.reverse).then(function(result) {
    $scope.showLoading = false;
  });
};

---

您需要知道流程完成的确切时间，在这里使用Promise是一种常见的方法。如果您不能使用ES6 Promises，您可以尝试AngularJS。

使用promise的

。最后

方法停止微调器：

$scope.showLoading = true;

$http.get(url)
  .then(function(response) {
    $scope.data = response.data;
}).catch(function(response) {
    console.log(response.status);
    throw response;
}).finally(function() {
    $scope.showLoading = false;
});

---

.finally

块将始终在服务器响应数据或错误后执行

我想知道

Peca.query

是一个基于第三方回调的API。要将其与AngularJS框架集成，请使用：

该函数调用

Peca.query

操作，并从回调中创建AngularJS承诺。它使用属性名

$promise

将承诺附加到资源对象

然后按如下方式使用：

$scope.enjuListBackPecafunction = function() {
    $scope.mostrarLoading = true;
    var resource = ajsPecaQuery({
        dateFromPeca:'20170101',
        dateToPeca:'20180830'
        // dateToPeca: $scope.endDate
    });
    resource.$promise.finally(function() {
        $scope.mostrarLoading = false;
    });

    return $scope.enjuListBackPeca = resource;
};

该函数在操作开始时启动微调器。它使用promise的

.finally

方法停止旋转器

---

不要忘记注入

$q

服务。

ES6承诺没有与AngularJS执行上下文集成。只有在AngularJS执行上下文中应用的操作才能从AngularJS数据绑定、异常处理、属性监视等中受益。对我来说，这些操作太复杂了。。抱歉，我正在寻找一种简单的方法……刚刚开始javascript编码。@HugoAroeira就是这样，处理异步内容需要一些复杂性。我建议您开始调查promise、deffered、async/await、observable和其他异步模式。当询问由代码引起的问题时，如果您提供人们可以用来重现问题的代码，您将得到更好的答案。请参阅。谢谢，已经更新了…这里的代码没有进行页面加载。某个地方有一个监视程序正在监视

$scope.reverse

，并调用一个执行页面加载的函数。这是在第三方库中完成的还是在您自己的代码中完成的？

Peca.query

是第三方库吗？如果是这样，它的回调在AngularJS执行上下文之外运行。如果

Peca.query

是$resource对象，则回调是错误的，“$scope.mostrarLoading=true”只是在HTML中显示一个div，其中包含一句话“waiting，loading…”。我想做的是在函数完成其工作时隐藏这个div实际上更新函数可以工作…我只想将它应用于示例中的代码。

function ajsPecaQuery(options) {
    var deferred = $q.defer();
    var resource = Peca.query(options, function (err, values) {
        if (err) return deferred.reject(err);
        //else
        return resolve(values);
    });
    resource.$promise = deferred.promise;
    return resource;
}

$scope.enjuListBackPecafunction = function() {
    $scope.mostrarLoading = true;
    var resource = ajsPecaQuery({
        dateFromPeca:'20170101',
        dateToPeca:'20180830'
        // dateToPeca: $scope.endDate
    });
    resource.$promise.finally(function() {
        $scope.mostrarLoading = false;
    });

    return $scope.enjuListBackPeca = resource;
};