javascript - api调用中的$ scope变量有时不会更新

因此，我试图在用户成功登录到外部API之后显示一些数据。

登录时，有时直到刷新页面后，数据才能正确更新。此外，该错误似乎仅在完全刷新后仍然存在，并且我已经注销了API。

服务是这样的：

angular.module('myApp')
  .service('PlayerAPICall', function ($http, $q) {
    // AngularJS will instantiate a singleton by calling "new" on this function
    var deferred = $q.defer();

    return {
      getPlayerInfo: function() {
        var getPlayerBasic = {
          method: 'GET',
          url: 'API_URL',
          headers: {
            'Accept': 'HEADER'
          }
        };

        // This API call returns some basic player information for the current logged in user.
        $http(getPlayerBasic).success(function(response) {
          deferred.resolve(response);
        });

        return deferred.promise;
      },
    }
  });

我的指令与此类似（包含相关信息）

angular.module('myApp')
  .controller('NavbarCtrl', function($scope, PlayerAPICall) {

    // Declare $scope objects.
    $scope.playerBasic;

    PlayerAPICall.getPlayerInfo().then(function(response) {
      $scope.playerBasic = response;
    });

  })

部分看起来像这样：

  <div class='links-container'>
    <div class='row'>
      <div class='inputs'>
        <form ng-submit='submit()'>
        <p ng-show='playerBasic.first_name != null' class='md-text logout-container'>
          Hello, {{playerBasic.first_name}}
          <span class='logout-span'><button class='btn btn-primary logout-btn' type='submit' ng-model='submit'>Logout</button></span></p>
        <p ng-show='playerBasic.first_name == null' class='md-text logout-container'>
          Hello, {{playerBasic.email}}
          <span class='logout-span'><button class='btn btn-primary logout-btn' type='submit' ng-model='submit'>Logout</button></span>
        </p>
        </form>
      </div>
    </div>

尽管我知道该用户存在名称变量，但有时会说：

'你好， '
而不是“你好，名字”。

我不太确定为什么$ scope不会改变。

最佳答案

无需使用$q.defer()来产生承诺，因为$ http服务已经返回了承诺：

angular.module('myApp')
  .service('PlayerAPICall', function ($http, $q) {
    //var deferred = $q.defer();

    return {
      getPlayerInfo: function() {
        var getPlayerBasic = {
          method: 'GET',
          url: 'API_URL',
          headers: {
            'Accept': 'HEADER'
          }
        };

        //$http(getPlayerBasic).success(function(response) {
        //  deferred.resolve(response);
        //});
        //return deferred.promise;

        var promise = $http(getPlayerBasic);
        var derivedPromise = promise.then(function(response) {
            //return data to chain
            return response.data;
        });
        return derivedPromise;
      },
    }

}）;

上面的示例创建一个成功的诺言，该诺言将使用响应对象的data属性进行解析。错误将被错误响应的响应对象拒绝。

以这种方式派生承诺的好处是，如果出现错误，则承诺链不会中断。无法拒绝$q.defer()会导致$q.defer承诺在出现错误时挂起，并会导致内存泄漏。

关于javascript - api调用中的$ scope变量有时不会更新，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40600408/