Firebase child_added`此「不起作用

我正在使用Angular2, ionic2 and firebase開發聊天應用程序。爲了讓聊天我嘗試下面的方法Firebase child_added`此「不起作用

控制器代碼：

displayAllMessage() { 
    let myDataRef = new Firebase("firbaseurl"); 
    myDataRef.on('child_added', function(snapshot) { 
     this.message = snapshot.val(); 
     console.log(this.message); 
    }); 
    }

查看代碼：

<h1> {{message.text}} </h1>

但這裏的問題是 - 如果我使用this.message它拋出的錯誤說this.message是未定義的，如果我使用var message而不是this，那麼它工作正常。如果我使用var message，那麼我無法在視圖中顯示它。

預先感謝您。

來源

2016-04-12 Akash Rao

同樣情況另一種情況，其問題(this)。由於您的this將把回調函數

...function(snapshot) { 
     this.message = snapshot.val(); 
     console.log(this.message); 
    });

的情況下它不會是能夠找到的可變信息。解決方法是將引用（this）傳遞給外部方法，然後在回調中訪問它。所以你的代碼看起來像。

displayAllMessage(parentRef : any) { 
    let myDataRef = new Firebase("firbaseurl"); 
    myDataRef.on('child_added', function(snapshot) { 
     parentRef.message = snapshot.val(); 
     console.log(parentRef.message); 
    }); 
    }

和調用 displayAllMessage(this);代替displayAllMessage();

來源

2016-04-12 11:30:41

使用箭頭功能的() => { ... }代替function() { ... }的方法保留this.

displayAllMessage() { 
    let myDataRef = new Firebase("firbaseurl"); 
    myDataRef.on('child_added', (snapshot) => { 
     this.message = snapshot.val(); 
     console.log(this.message); 
    }); 
    }

參見https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Functions/Arrow_functions

displayAllMessage() { 
    let myDataRef = new Firebase("firbaseurl"); 
    myDataRef.on('child_added', function (snapshot) { 
     this.message = snapshot.val(); 
     console.log(this.message); 
    }.bind(this)); 
    }

範圍

來源

2016-04-12 11:51:17

Firebase child_added`此「不起作用

回答

相關問題