![](/img/trans.png)
[英]How to properly move function from component.ts to a service file?
[英]How to handle socket.io acknowledgement from service.ts to component.ts on emit success Angular 8
当客户端使用 socket.io 向服务器发送新消息时,服务器会通过回调 fn() 发送对新创建的 messageId 的确认。 我能够在 service.ts 中记录 messageId,但无法找到将 messageId“获取”到 component.ts 的方法(以便使用 ID 更新新创建的消息)。 通过下面设置代码的方式,我得到一个 angular 错误,说我无法订阅 this.appService.newMessage(),即使我在 service.ts 中返回一个带有 of(newMsgId) 的新消息 ID 的 Observable。 如果我可以添加更多信息来帮助,请 lmk
server.js
--------
socket.on('newStaffMessage', function (data, fn) {
var msg = new Message({
sender: data.senderId,
content: { text: data.content.text, attachment: null },
dateTime: new Date(),
});
msg.save((err, messageDoc) => {
Conversation.findByIdAndUpdate(
{ _id: data.conversationId },
{
$push: { messages: messageDoc._id },
},
{ new: true },
function (err, convoDoc) {
if (!err) {
User.findById(data.senderId, function (err, userDoc) {
const payload = {
conversationId: convoDoc._id,
_id: messageDoc._id,
content: {
text: msg.content.text,
attachment: msg.content.attachment,
},
dateTime: msg.dateTime,
sender: {
_id: userDoc._id,
firstName: userDoc.firstName,
lastNameInitial: userDoc.lastNameInitial,
},
};
io.in(convoDoc._id).emit('newStaffMessage', payload);
fn({messageId: messageDoc._id});
});
} else {
console.log(err);
}
}
);
});
});
service.ts
----------
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable, Observer, of } from 'rxjs';
import * as io from 'socket.io-client';
@Injectable({
providedIn: 'root',
})
export class AppService {
private socket = io('http://localhost:3000');
constructor(private http: HttpClient) {}
newMessage(msg) {
this.socket.emit('newStaffMessage', msg, (newMsgId) => {
return of(newMsgId);
});
}
component.ts
------------
this.appService.newMessage(newMessage).subscribe(data => {
console.log(data);
})
您应该正确地将处理 socket.io 事件与回调转换为Observable
。
我建议你在这里有两个选择:
1)利用给定订阅 function 的Observable
构造函数或create
运算符:
import { Observable } from 'rxjs';
...
newMessage(msg) {
return Observable.create(observer => {
this.socket.emit('newStaffMessage', msg, (newMsgId) => {
observer.next(newMsgId);
});
});
}
2) 专用于此类用途 RxJS bindCallback function:
import { bindCallback } from 'rxjs';
newMessage(msg) {
return bindCallback(this.socket.emit)('newStaffMessage', msg);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.