WebSocket callback within arrow function not setting 'this' lexically
<p>I am trying to create a WebSocket service in Angular 2. Here is what I have so far:</p>

<pre><code>import {Injectable} from "angular2/core"
@Injectable()
export class ServerService {

    public ws:WebSocket;

    public myData = {};

    constructor() {
        let ws = new WebSocket('ws://localhost:8080/');

        ws.onopen = (event:Event) =&gt; {
            console.log("Socket has been opened!");
        };

        ws.onmessage = (event:Event) =&gt; {
            this.myData = JSON.parse(event.data);
        };
    };
}
</code></pre>

<p>The problem is, when <code>onmessage</code> runs, the <code>this</code> keyword becomes the WebSocket object, instead of my <code>ServerService</code> object. </p>

<p>It seems like my arrow function is acting as a standard function. What could be causing this? Is there another way to get back to the <code>ServerService</code> object?</p>