Firebase child_removed 无法实时工作

Question

我正在使用 Angularjs 和 Firebase 关注 tutsplus 实时网络应用程序。我有 main.js（下图），它允许我在 Firebase 中实时添加和更改项目，而无需刷新浏览器（在 Chrome 和 Safari 中）。但是，当我从 Firebase 中删除一条消息时，我必须刷新浏览器才能更新消息列表——所以不是实时的。我看不出问题出在哪里。

/*global Firebase*/
'use strict';

/**
 * @ngdoc function
 * @name firebaseProjectApp.controller:MainCtrl
 * @description
 * # MainCtrl
 * Controller of the firebaseProjectApp
 */
angular.module('firebaseProjectApp')
  .controller('MainCtrl', function ($scope, $timeout) {
    var rootRef = new Firebase('https://popping-inferno-9738.firebaseio.com/');
    var messagesRef = rootRef.child('messages');

    $scope.currentUser=null;
    $scope.currentText=null;
    $scope.messages=[];

    messagesRef.on('child_added', function(snapshot){
        $timeout(function() {
            var snapshotVal = snapshot.val();
            console.log(snapshotVal);
            $scope.messages.push({
                text: snapshotVal.text,
                user: snapshotVal.user,
                name: snapshot.key()

            });         
        });
    });

    messagesRef.on('child_changed', function(snapshot){
        $timeout(function() {
            var snapshotVal = snapshot.val();
            var message = findMessageByName(snapshot.key());
            message.text = snapshotVal.text;
        });
    });
    messagesRef.on('child_removed', function(snapshot){
        $timeout(function() {
            var snapshotVal = snapshot.val();
            var message = findMessageByName(snapshot.key());
            message.text = snapshotVal.text;
        });
    });
    function deleteMessageByName(name){

        for(var i=0; i < $scope.messages.length; i++){
            var currentMessage = $scope.messages[i];
            if(currentMessage.name === name){
                $scope.messages.splice(i, 1);
                break;
            }
        }
    }
    function findMessageByName(name){

        var messageFound = null;
        for(var i=0; i < $scope.messages.length; i++){
            var currentMessage = $scope.messages[i];
            if(currentMessage.name === name){
                messageFound = currentMessage;
                break;
            }
        }
        return messageFound;
    }

    $scope.sendMessage = function(){

        var newMessage = {
            user: $scope.currentUser,
            text: $scope.currentText 
        };

        messagesRef.push(newMessage);
    };


  });

Answer 1

从 Firebase 删除消息时调用的代码：

messagesRef.on('child_removed', function(snapshot){
    $timeout(function() {
        var snapshotVal = snapshot.val();
        var message = findMessageByName(snapshot.key());
        message.text = snapshotVal.text;
    });
});

此代码从未实际删除 HTML/DOM 中的消息。

有一个方便的deleteMessageByName方法来处理删除。所以如果你把上面的修改成这样，它就会起作用：

messagesRef.on('child_removed', function(snapshot){
    $timeout(function() {
        deleteMessageByName(snapshot.key());
    });
});

Firebase child_removed 无法实时工作

Firebase child_removed not working in real-time

angularjs

firebase