AngularJS & Firebase auth ngShow 和 ngClick 延迟？答案

【问题标题】：AngularJS & Firebase auth ngShow and ngClick delay?AngularJS & Firebase auth ngShow 和 ngClick 延迟？
【发布时间】：2017-03-02 05:15:13
【问题描述】：

我刚开始使用 AngularJS，我遇到了一个关于 Firebase 身份验证的奇怪问题。我有一个非常简单的正文，它显示当前用户状态（登录，真或假）和一个登录和注销选项。

当我第一次单击登录按钮时，没有任何反应。当我第二次单击它时，登录状态会发生变化，并且 ng-show 和 ng-hide div 会切换。

点击退出时同样的问题。

为什么只有在第二次点击后才会出现？

index.html：

<div class="container" ng-controller="userCtrl">    

    <h1>User logged in: {{loggedIn}}</h1>

    <div ng-hide="loggedIn">
        <div class="form-group">
            <label for="email">Email:</label> 
            <input type="email" class="form-control" name="email" ng-model="user.email" />
        </div>
        <div class="form-group">
            <label for="password">Password:</label> 
            <input type="password" class="form-control" name="password" ng-model="user.password" />
        </div>
        <button type="button" class="btn btn-lg btn-success" ng-click="signIn()">Sign in</button>
    </div>
    <div ng-show="loggedIn"><button type="button" class="btn btn-lg btn-danger" ng-click="signOut()">Sign out</button></div>
</div>

控制器：

var myApp = angular.module("tijdlozespelApp", ["firebase"]);

    myApp.controller("userCtrl", function ($scope, $firebaseObject) {   

    $scope.loggedIn = false;

    $scope.signIn = function() {
            var email = $scope.user.email;
            var password = $scope.user.password;
            firebase.auth().signInWithEmailAndPassword(email, password).then(function(user) {
            $scope.loggedIn = true;
        }).catch(function(error) {
            $scope.loggedIn = false;
        });
    }

    $scope.signOut = function() {
        firebase.auth().signOut().then(function() {
            $scope.loggedIn = false;
        });
    }   

});

【问题讨论】：

标签： javascript angularjs authentication firebase angularfire

【解决方案1】：

当您使用异步处理程序时，使用 $scope.$apply(function() {...}) 来更新您的范围数据。 Angular 在识别异步操作的范围更改方面存在问题。

$scope.$apply(function() {
   $scope.loggedIn = true;
});

【讨论】：