Javascript 分配websocket消息数据时无法读取未定义的属性

我正在使用Ratchet Websocket创建一个聊天应用程序。我在这里学习了他们的Hello World教程：

当我试图通过全局函数或变量分配接收到的消息的数据时，我得到错误：

错误类型错误：无法读取未定义的属性'ReceivedMessage' 在onMessage_回调（dashboard.component.ts:32）上 在WebSocket.conn.onmessage[作为u分区u符号u在u属性消息上]”

我读过许多其他的海报，都有同样的问题，但我不知道如何让他们的答案像他们说的那样发挥作用。我正在尝试将发送和接收的消息添加到全局数组中，以便可以在聊天列表中显示它们。我知道我的问题与this.conn.onmessage=function（e）的范围有关，但这是我第一次使用WebSocket或看到这种语法。 为什么我不能调用此。ReceivedMessage（数据）来自消息回调（数据）的

函数

类似的问题（它甚至提到可以将回调中的数据分配给全局变量，但这对我不起作用）：

我知道我的所有后端客户端/聊天php都正常工作，因为控制台显示了不同连接的消息

打字脚本代码：

export class DashboardComponent implements OnInit {

  conn:WebSocket;
  messageDisplay:any[] = ["Welcome To Chat"]
  message: string;

  constructor() {}
  

  ngOnInit(): void {
    this.conn = new WebSocket('ws://localhost:8080');
    this.conn.onopen = function(e) {
      console.log("Connection established!");
    };
  
    this.conn.onmessage = function(e) {
      console.log(e.data);
      onMessage_callback(e.data);
    };

    function onMessage_callback(data){
      this.recievedMessage(data);
    }
  }

  recievedMessage(message){
    this.messageDisplay.push(message);
  }



  sendMessage(message){
    this.conn.send(message);
      this.messageDisplay.push(message);
      console.log(this.messageDisplay);
  }

}

非常感谢您的帮助：）
当您在另一个函数（onMessage_callback）中时，
此
的上下文已更改，因此此时此

不再引用父对象

要将引用

this

用于主类，必须将该引用包装在另一个局部变量中（在本例中，

self

）

这是一个明确的共同功能

binding

---

谢谢，它成功了！我不知道这种情况会发生变化。我认为它总是指类中的顶级变量。

ngOnInit(): void {
    var self = this;
    this.conn = new WebSocket('ws://localhost:8080');
    this.conn.onopen = function(e) {
      console.log("Connection established!");
    };
  
    this.conn.onmessage = function(e) {
      console.log(e.data);
      onMessage_callback(e.data);
    };

    function onMessage_callback(data){
      self.recievedMessage(data); 
    }
  }