让图像进行说话:http://www.youtube.com/watch?v=4jgdj8LBQRs [25秒]
Plunker:http://plnkr.co/edit/pL3z77vmYeSZzGMSL0YV?p=preview
Firebase GUI:http://syncing.firebase-demo.io/
我使用角度1.2.6(相当近期)和AngularFire 0.6(最新版本)。
以下代码的关键片段(plunker拥有一切)
$rootScope.$watch("loginState", function() {
$scope.loginState = $rootScope.loginState;
if ($scope.loginState == "loggedIn") {
$scope.$firRef = $firebase(new Firebase($scope.firebaseURL + "testuser/todos/"));
$scope.$firRef.$bind($scope, "todos").then(function(unbind) {
$scope.unbindFunction = unbind; // I store reference to unbinding function
});
} else if ($scope.loginState == "loggedOut") {
$scope.unbindFunction(); // and call it on logout
$scope.$firRef = null // doesn't help either
$scope.todos = [];
}
});
$scope.login = function() {
loginService.login();
}
$scope.logout = function() {
loginService.logout();
}
(请注意我存储对unbind函数的引用并在注销时调用它)
app.factory('loginService', ['$rootScope', function($rootScope) {
return {
login: function() {
$rootScope.loginState = "loggedIn";
},
logout: function() {
$rootScope.loginState = "loggedOut";
}
}
}]);
关于3向数据绑定的文档:https://www.firebase.com/docs/angular/reference.html#bind-scope-model
相关: