2016-10-10 13 views
1

Firebaseデータベースからrefの子を削除するのが少し難しかったです。 私はjavascriptを使用しています。私は、FriendlyChatソースにスターターとして追加する機能を追加しようとしています。Firebaseデータベースからrefの子を削除する

ここに私の削除機能がありますが、何らかの理由で削除されません。

FriendlyChat.prototype.loadMessages = function() { 
    // Reference to the /messages/ database path. 
    this.messagesRef = this.database.ref('notifications'); 
    // Make sure we remove all previous listeners. 
    this.messagesRef.off(); 

    // Loads the last 12 messages and listen for new ones. 
    var setMessage = function(data) { 
    var val = data.val(); 
    this.displayMessage(data.key, val.description, val.title, val.photoUrl, val.imageUrl); 
    this.deleteMessage(data.key); 
    }.bind(this); 
    this.messagesRef.limitToLast(12).on('child_added', setMessage); 
    this.messagesRef.limitToLast(12).on('child_changed', setMessage); 
    this.messagesRef.limitToLast(12).on('child_removed', setMessage); 
}; 

私は今しばらく立ち往生されています:

FriendlyChat.MESSAGE_TEMPLATE = 
    '<div class="message-container" style="padding-bottom: 30px;padding-top:30px">' + 
     '<center><div class="spacing"><div class="pic"></div> </div>' + 
     '<div style="font-size:24px" class="message"></div><br>' + 
     '<div style="font-size:20px;padding-left:0px" class="name"></div></center>' + 
     '<div onClick="deleteMessage(this.id)" class="delete">Delete</a>' + 
    '</div>'; 

// A loading image URL. 
FriendlyChat.LOADING_IMAGE_URL = 'https://www.google.com/images/spin-32.gif'; 

// Displays a Message in the UI. 
FriendlyChat.prototype.displayMessage = function(key, name, text, picUrl, imageUri) { 
    var div = document.getElementById(key); 
    // If an element for that message does not exists yet we create it. 
    if (!div) { 
    var container = document.createElement('div'); 
    container.innerHTML = FriendlyChat.MESSAGE_TEMPLATE; 
    div = container.firstChild; 
    div.setAttribute('id', key); 
    this.messageList.appendChild(div); 
    } 
    if (picUrl) { 
    div.querySelector('.pic').style.backgroundImage = 'url(' + picUrl + ')'; 
    } 
    div.querySelector('.delete').setAttribute('id', key); 
    div.querySelector('.name').textContent = name; 
    var messageElement = div.querySelector('.message'); 
    if (text) { // If the message is text. 
    messageElement.textContent = text; 
    // Replace all line breaks by <br>. 
    messageElement.innerHTML = messageElement.innerHTML.replace(/\n/g, '<br>'); 
    } else if (imageUri) { // If the message is an image. 
    var image = document.createElement('img'); 
    image.addEventListener('load', function() { 
     this.messageList.scrollTop = this.messageList.scrollHeight; 
    }.bind(this)); 
    this.setImageUrl(imageUri, image); 
    messageElement.innerHTML = ''; 
    messageElement.appendChild(image); 
    } 
    // Show the card fading-in. 
    setTimeout(function() {div.classList.add('visible')}, 1); 
    this.messageList.scrollTop = this.messageList.scrollHeight; 
    this.messageInput.focus(); 
}; 

FriendlyChat.prototype.deleteMessage = function(key) { 
    this.deleteRef = this.database.ref('notifications'); 
document.getElementById(key).onclick = function() { 
     if (confirm("Are you sure you want to delete this notification?") == true) { 
     alert("Removed: " + key); 
     this.deleteRef.child(key).remove(); 
     } else { 
     alert("Canceled"); 
     } 
} 
}; 

は、ここに私のloadMessagesです。誰かが説明したり、助けてくれることを願っています

ありがとうございました!

答えて

0

だから私はそれを理解した!私のfirebaseのリファレンスがうまくいきませんでした。 更新されたコードは次のとおりです。

FriendlyChat.prototype.deleteMessage = function(key) { 
    //this.deleteRef = this.database.ref('notifications'); 
document.getElementById(key).onclick = function() { 
     if (confirm("Are you sure you want to delete this notification?") == true) { 
     alert("Removed: " + key); 
     firebase.database().ref('notifications').child(key).remove(); 
     } else { 
     alert("Canceled"); 
     } 
} 
}; 
関連する問題