javascript - 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

这是一个登录功能，效果很好。但是，问题是我得到 error提交登录后 3、4 秒。我注意到我的{{message}}在我收到 $scope.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 服务中提供了围绕这些身份验证功能的便捷包装器。请参阅section in the AngularFire guide on logging users in 。

您正在寻找的包装函数是$authWithPassword，请阅读 how to use $authWithPassword in its API documentation 的示例.