在angular应用中实现socket通道切换

npm install socket.io-client --save

import { Injectable } from '@angular/core';
import * as io from 'socket.io-client';

@Injectable({
  providedIn: 'root'
})
export class SocketService {
  private socket: SocketIOClient.Socket;

  constructor() {
    // 连接到服务器的socket.io实例
    this.socket = io('服务器地址');
  }

  // 发送消息
  sendMessage(message: string) {
    this.socket.emit('message', message);
  }

  // 监听消息
  onMessage() {
    return new Observable<string>(observer => {
      this.socket.on('message', (message: string) => {
        observer.next(message);
      });
    });
  }
}

import { Component, OnInit } from '@angular/core';
import { SocketService } from '路径';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponent implements OnInit {
  message: string;

  constructor(private socketService: SocketService) { }

  ngOnInit() {
    // 监听消息
    this.socketService.onMessage().subscribe(message => {
      this.message = message;
    });
  }

  // 发送消息
  sendMessage() {
    this.socketService.sendMessage(this.message);
  }
}