AngularFire(Angular+Firebase)身份验证错误延迟

Question

我发现了一些奇怪的东西。请帮忙！

$scope.login = function() {
    ref.authWithPassword({
        email: $scope.user.email,
        password: $scope.user.password
    }, function(error, authData) {
        if (error) {
            console.log("Login Failed!", error);
            $scope.message = error.toString();
        } else {
            $location.path('/meetings');
            console.log("Authenticated successfully with payload:", authData);
        }
    });
} //login

这是一个登录功能，它运行得很好。然而，问题是我在提交登录信息后3-4秒就得到了error。我注意到，在$scope.message收到值后，我的{{message}}不会立即更新。我认为Angular应该在它改变后立即显示这个值？

在我第二次点击后，我得到了错误显示。

这就是我打印值的地方：

<p class="error formerror" ng-show="message">{{message}}</p>

Answer 1

您正在调用authWithPassword，它是Firebase常规JavaScript SDK的一部分。此API将启动身份验证过程，并在身份验证完成时调用您的函数。不幸的是，此时AngularJS不再知道您对$scope进行了任何更新。

为了让AngularJS知道更新，请将代码封装在$timeout调用中：

$scope.login = function() {
    ref.authWithPassword({
        email: $scope.user.email,
        password: $scope.user.password
    }, function(error, authData) {
        $timeout(function() {
            if (error) {
                console.log("Login Failed!", error);
                $scope.message = error.toString();
            } else {
                $location.path('/meetings');
                console.log("Authenticated successfully with payload:", authData);
            }
        });
    });
} //login

请注意，正是出于这个原因，AngularFire在其$firebaseAuth服务中为这些身份验证功能提供了方便的包装。请参阅AngularFire指南中关于将用户登录的部分。

您正在寻找的包装器函数是$authWithPassword，请阅读API文档中关于如何使用$authWithPassword的示例。