[英]Angular, Socket.io : Emit an array of object
With Angular how can I subscribe to an array of objects like this one:使用 Angular,我如何订阅像这样的对象数组:
[
'abc/user2': { room: 'abc/user2', user: 'user2' },
'abc/admin': { room: 'abc/admin', user: 'admin' }
]
Currently this doesn't work :目前这不起作用:
this.socketService.onRoom().subscribe(rooms => {
this.rooms = rooms;
});
With socketService
:使用
socketService
:
public onRoom() {
return new Observable<any>(observer => {
this.socket.on('room', (data: any) => observer.next(data));
});
}
Edit:编辑:
Mybad, it seems that problem comes from the server (NodeJS/express/socket.io) : Mybad,问题似乎来自服务器(NodeJS/express/socket.io):
chat-server.ts
: chat-server.ts
:
public rooms: Array<{room: string, user:string}> = [];
(...)
this.rooms[room] = {room: room, user: socket.user};
this.io.emit('room', this.rooms)
console.log('[server]rooms :', this.rooms)
Server side, console.log print :服务器端, console.log 打印:
[
'abc/user2': { room: 'abc/user2', user: 'user2' },
'abc/admin': { room: 'abc/admin', user: 'admin' }
]
But clientside in socketService
, if i do a console.log(data) here :但是在
socketService
客户端,如果我在这里做一个 console.log(data) :
public onRoom() {
return new Observable<any>(observer => {
this.socket.on('room', (data: any) => {
console.log(data)
observer.next(data)
});
});
}
It return :它返回:
[]
But if I emit serverside:但是如果我发出服务器端:
this.io.emit('room', Object.keys(this.rooms))
Clientside it return:客户端返回:
['abc/user2', 'abc/admin']
It's look like i can't emit an array of object from socket.io ?看起来我无法从 socket.io 发出对象数组?
You can't.你不能。 You have to turn it into an observable of some kind..
你必须把它变成某种可观察的..
import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
export class AppComponent implements OnInit {
private readonly data = [
{
'abc/user2': { room: 'abc/user2', user: 'user2' }
},
{
'abc/admin': { room: 'abc/admin', user: 'admin' }
}
];
private data$;
ngOnInit() {
this.data$ = new Observable((observer) => {
observer.next(this.data);
observer.complete();
});
this.data$.subscribe(data => {
console.log(data);
});
}
Though there are many other ways (and probably better ways) to do it.尽管有许多其他方法(可能还有更好的方法)来做到这一点。 Just an example for you since I don't know exactly what you are trying to accomplish.
只是一个例子,因为我不知道你到底想完成什么。
You should create observable which you want to return outside of socket.on
method.您应该创建要在
socket.on
方法之外返回的socket.on
。
public onRoom(): Observable<any> {
BehaviorSubject<any> toReturn = new BehaviorSubject();
this.socket.on('room', (data: any) => toReturn.next(data));
return toReturn;
}
private myArray = [
'abc/user2': { room: 'abc/user2', user: 'user2' },
'abc/admin': { room: 'abc/admin', user: 'admin' }
];
private myObservable= Observable.of(this.myArray);
You can subscribe to myObservable
then.然后您可以订阅
myObservable
。
I finally manage to resolve this problem by not emitting an array of object, but just an object我终于通过不发出对象数组,而只是发出一个对象来解决这个问题
chat-server.ts
//public rooms: Array<{room: string, user:string}> = [];
public rooms: any = {};
And client side, i convert my object to an array, so that i can iterate throw it in template.在客户端,我将我的对象转换为数组,以便我可以迭代将它扔到模板中。
chat-list.component.ts
this.socketService.onRoom().subscribe(rooms => {
this.rooms = rooms;
this.roomsArr = Object.entries(this.rooms);
});
Still, I don't understand why i couldn't manage to emit an array of object from socket.io尽管如此,我还是不明白为什么我无法从 socket.io 发出一个对象数组
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.