$ http承诺不更新范围(ng-hide)

时间:2014-04-24 14:37:26

标签: javascript angularjs

我在这里尝试实现的是向我的api发送一个get请求,它根据用户是否登录而以true / false响应。理想情况下,如果用户登录,我想隐藏登录表单。我使用的是http方法内置的角度,它返回一个承诺,据我所知,已经包含在$ apply中,所以我会想到范围会自动更新。

我的控制器:

.controller('MyCtrl1', ['$scope', 'isLoggedIn', '$timeout', function($scope, isLoggedIn, $timeout) {

        isLoggedIn.getState().then(function(result) {   
            $scope.displayLogin = result.data.state;
        });

        $scope.getLoginState = function() {
             console.log($scope.displayLogin);
        }
}]);

我的服务:

.factory('isLoggedIn', function($http, $q) {
    return {
        getState: function(scope) { 
            return $http.get('/login-state').then(function(result) {
                return result
            });
        }
    }
})

HTML:

  <form method="most" action="/login" ng-hide="displayLogin">

我知道值本身正在更新,因为我有一个带有点击绑定到getLoginState方法的按钮,它返回带有正确值的displayLogin,看来ng-hide是不是反映了这个?好像范围不知道变化。

我怎样才能使这个工作,以便我的真实价值隐藏表格?

2 个答案:

答案 0 :(得分:0)

根据您的代码,您似乎指定工厂返回$http服务的承诺?

.factory('isLoggedIn', function($http, $q) {
    return {
        getState: function(scope) { 
            return $http.get('/login-state');
        }
    }
});

答案 1 :(得分:0)

我会尝试让一个侦察员检查这个,但如果你不是

isLoggedIn.getState().then(function(result) {   
    $scope.displayLogin = result.data.state;
});

尝试写

$scope.displayLogin = isLoggedIn.getState()

修改你的工厂以返回$ http.get而不是$ http.get本身的结果?

更新:以下是使用承诺($ q服务)的工厂版本:

.factory('isLoggedIn', function($http, $q) {
    return {
        getState: function(cb) { 
          var deferred = $q.defer();
          $http.get("/login-state").success(function(data){
            deferred.resolve(data);
          });
          deferred.promise.then(function (result) {
            return cb(result);
          });
        }
    }
});

然后你就这样使用它:

isLoggedIn.getState(function(returnData) {
    $scope.displayLogin = returnData;
});

我不得不使用回调来让它正确更新。获取数据时,应更新您的promise对象。这是一个关于plunker的链接:http://plnkr.co/edit/c5YguV5PbE29ZLay3oI4?p=preview