2016-07-30 5 views
1

私はFirebase DBからオブジェクトにロードし、コントローラの変数に割り当てます。これはFirebase関数(コメント付きのコードを参照)を使用していたときに完全に機能しましたが、3ウェイバインディングを使用してAngularFireで同じことをしようとしています。

plannerオブジェクト(「You Are Here」も)がコンソールに決して印刷しないので、$ loadedイベントは起動しないようです。 user.uid文字列は期待どおりにコンソールに出力され、コメントアウトされたコードは完全に機能します。あなたの助けを前にありがとう。

(サイド質問:情報が取得されたときにコメントアウトコードでは、私は、Webページ上のフォームを確実にするためにevalAsyncを利用して、実際に更新する - これは良い習慣です?)

マイコントローラ:

firebase.auth().onAuthStateChanged(function(user) { 
     if (user) { 
      console.log("Currently logged in user..."); 
      console.log(user.uid); 
      $scope.user = user; 

      var ref = firebase.database().ref('planners/' + $scope.user.uid); 
      var planner = $firebaseObject(ref); 

      planner.$loaded().then(function() { 
       console.log("You are here") 
       console.log(planner) 
      }) 
      .catch(function(error) { 
       console.log(error) 
      }) 
      // firebase.database().ref('planners/' + $scope.user.uid).on('value', function(response) { 
      // if (response.val() != null) { 
      //  $scope.$evalAsync(function() { 
      //   $scope.planner = response.val(); 
      //  }) 
      // } 
      // }); 
     } 
     else { 
      console.log('No user logged in') 
      $state.go('login') 
     } 
    }) 

答えて

0

@Aaronサンダースが示唆したように、それは角度とのよりよい統合(更新$scope S、トリガー$digest秒など)であることから、あなたはAngularFireの認証オブジェクトを使用する必要があります。

あなたが前にいるため実行されていない$digest 1つが発射$evalAsyncで働いていたコードは($digestループは、モデルとビューの間でデータをバインドする魔術師です)。

実際に行うべきことは、AngularFireを使用してデータをバインドすることです。彼らはまた、$bindToを利用して "3方向結合"(モデルビューデータベース)を提供します。

あなたは自動的にサーバからクライアントに同期します$firebaseObjectdocsデータで見ることができますが、あなたが戻ってサーバーへのローカルの変更を保存したい場合は、あなたが$save$bindToを使用する必要がありますとおり。

コード修正提案:

$firebaseAuth().$onAuthStateChanged(function(user) { 
    // By using `$firebaseAuth` this function will be called in a `$digest` so all changes will be bound 
    if (user) { 
     console.log("Currently logged in user..."); 
     console.log(user.uid); 
     $scope.user = user; 

     var ref = firebase.database().ref('planners/' + $scope.user.uid); 
     // `$destroy` previous bindings 
     if ($scope.planner && angular.isFunction($scope.planner.$destroy)) { 
      $scope.planner.$destroy(); 
     } 
     $scope.planner = $firebaseObject(ref); 

     // planner.$loaded().then(function() { 
     // // This code will happen only after `$digest` since its promise is relied on the `$q` service 
     // console.log("You are here") 
     // console.log(planner) 
     // }) 
     // .catch(function(error) { 
     // console.log(error) 
     // }) 
     // firebase.database().ref('planners/' + $scope.user.uid).on('value', function(response) { 
     // if (response.val() != null) { 
     //  $scope.$evalAsync(function() { 
     //   $scope.planner = response.val(); 
     //  }) 
     // } 
     // }); 
    } else { 
     console.log('No user logged in'); 
     $scope.user = null; 
     if ($scope.planner && angular.isFunction($scope.planner.$destroy)) { 
      $scope.planner.$destroy(); 
     } 
     $state.go('login'); 
    } 
});