socket.service.ts

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Observer } from 'rxjs/Observer';
import { Message } from '../model/message';
import { Event } from '../model/event';

import * as socketIo from 'socket.io-client';

const SERVER_URL = 'http://localhost:8080';

@Injectable()
export class SocketService {
    private socket;

    public initSocket(): void {
        this.socket = socketIo(SERVER_URL);
    }

    public send(message: Message): void {
        this.socket.emit('message', message);
    }

    public onMessage(): Observable<Message> {
        return new Observable<Message>(observer => {
            this.socket.on('message', (data: Message) => observer.next(data));
        });
    }

    public onEvent(event: Event): Observable<any> {
        return new Observable<Event>(observer => {
            this.socket.on(event, () => observer.next());
        });
    }
}

On line #31 - shouldn't you push the event to the observer's next() ?

Also you are missing the teardown on the onEvent so when you unsubscribe you don't keep the socket event listeners unnecessarily.

public onEvent(event:Event):Observable<any>{ return new Observable<Event>(observer =>{ const handler = (data)=>observer.next(data); this.socket.on(event,handler); return ()=>{this.socket.off(event,handler)} })

this way when you unsubscribe from onEvent you will tear down the event listener as well. Quite leaky this code here but a good starter for writing a service.