Angular＆Firebase auth ngShow and ngClick delay？

Question

私はAngularJSを使い始めましたが、私はFirebase認証に関して奇妙な問題に遭遇しています。私は現在のユーザーの状態（ログイン、真または偽）とsignInとsignOutオプションを示すとてもシンプルなボディを持っています。

初めてログインボタンをクリックすると、何も起こりません。 2回目にクリックすると、ログイン状態が変わり、ng-showとng-hide divが切り替わります。

サインアウトをクリックすると同じ問題が発生します。

なぜ2回目のクリック後にのみ発生しますか？

の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; 
     }); 
    } 

}); 

Answer 1

使用$スコープ$とき、あなたのスコープのデータを更新する（関数（）{...}）を適用非同期ハンドラを使用します。 Angularは、非同期操作のスコープ変更の識別に問題があります。

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