如何在Angular中取消订阅socket io

Question

这就是我使用套接字 io 将客户端连接到服务器的方式。

export class OverviewService {

  socket:any;
  readonly uri:string='http://localhost:4000';

  

  constructor(private http: HttpClient) {
    this.socket = io(this.uri);
   }

当我打电话时这个

getOnPeak(){
    this.socket.emit('on_peak/today');

    return new Observable((subscriber)=>{
      this.socket.on('on_peak/today',(data:any)=>{
        subscriber.next(data.onPeak.toFixed(2))
        console.log('onPeak:'+data.onPeak.toFixed(2));
      })
    })
    
  }

overview.ts

this.getOnPeekSub=this.overviewService.getOnPeak().subscribe(onPeak => {
      this.onPeak = onPeak;
    })

在 ngOnDestroy 上我尝试使用 removeAllListeners()、removeListeners() 和 off() 但它不起作用。

Answer 1

getOnPeak(){
    this.socket.emit('on_peak/today');

    return new Observable((subscriber)=>{
      this.socket.on('on_peak/today',(data:any)=>{
        subscriber.next(data.onPeak.toFixed(2))
        console.log('onPeak:'+data.onPeak.toFixed(2));
      })

      return function unsubscribe() {
        this.socket.disconnect()
      };
    })
    
  }

当您取消订阅 Observalbe 时，套接字将被关闭。 在此处阅读更多信息https://rxjs.dev/guide/observable（处理 Observable 执行）