AngularJS ng-if 变量只工作一次

Question

我在维护一个前段时间写的代码，没有经验AngularJS。我必须在触发 HTTP 请求时打开微调器，并在收到 HTTP 响应时将其关闭。

微调器由 ng-if 和 $scope.authenticating 变量控制。

目前，当页面加载时，微调器被打开（根据$scope.authenticating === false的初始状态。

用户切换开关并正确触发 HTTP，$scope.authenticating 设置为 true 并且微调器正确显示。

当 HTTP 响应 returns 时，控制台日志显示响应的内容，一切正常，然后 $scope.authenticating 设置为 false，但是：微调器仍然存在并没有消失。

感谢任何帮助。

代码如下。

控制器：

  $scope.authenticating = false


  $scope.myfunction = async function (check, change, user) {
    if (someCheck(user)) {
      $scope.modified = true;
      ...
      $scope.authenticating = true
      let res = await AppUserResource.patch(..., ...).$promise;
      console.log('res: ' + JSON.stringify(res))
      $scope.authenticating = false
    }
  }

亲戚HTML码:

  <div style="margin-top:13px">
    <div ng-if="!authenticating">
      <label class="switch">
        <input id="switch" ng-change="bypassApps(disabledAppsCheckbox, true, user)" ng-model="disabledAppsCheckbox"
               type="checkbox">
        <div class="slider round">
          <div class="slider-text pull-left text-green-table">{{'ON' | translate}}</div>
          <div class="slider-text pull-right text-red-table">{{'OFF' | translate}}</div>
        </div>
      </label>
    </div>
    <div ng-if="authenticating">
      <i class="fa fa-spinner fa-spin"style="font-size:270px;margin-bottom:5%; margin-top:5%;"></i>
    </div>
  </div>

Answer 1

当 async/await 模式在 angularJS 摘要循环之外使用时。为此，您必须致电

$scope.$apply()

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$apply

AngularJS ng-if 变量只工作一次

AngularJS ng-if variable works only once

javascript

angularjs

angularjs-ng-if