Firebase child_added`this`无效

Question

我正在开发一个聊天应用程序Angular2, ionic2 and firebase.为了得到聊天,我尝试了以下方法

控制器代码:

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那么我无法在视图中显示它.

先感谢您.

Answer 1

使用箭头功能() => { ... }而不是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));
  }