[英]Cannot push data through a service via HttpInterceptor
I created a MessageService
that I push data into which is then read by my app.main
to display those messages to the user. 我创建了一个
MessageService
,我将数据推送到其中,然后由我的app.main
读取以向用户显示这些消息。 When I use this service in a component it works fine. 当我在组件中使用此服务时,它可以正常工作。 What I want to do is move that up to the
HttpInterceptor
level which will monitor all HttpResponse
for server messages and push them into the service for user display. 我要做的是将其移到
HttpInterceptor
级别,它将监视所有HttpResponse
的服务器消息,并将它们推送到服务中以供用户显示。
Here is my service: 这是我的服务:
@Injectable()
export class MessageService {
private successMessageList = new Subject<string>();
successMessages$ = this.successMessageList.asObservable();
constructor() { }
addSuccessMsg(msg: string) {
this.setMsgs(this.successMessageList, msg);
}
private setMsgs(privMsgArray: Subject<string>, newMsgs: any) {
let messages = [];
messages.push(newMsgs);
messages.forEach(message => privMsgArray.next(message));
console.log(this.successMessageList);
}
}
Here is my HttpInterceptor 这是我的HttpInterceptor
@Injectable()
export class MyHttp implements HttpInterceptor {
constructor(private messageService: MessageService) {}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(req).do((event: HttpEvent<any>) => {
if (event instanceof HttpResponse) {
if(event.body['successMsg']) {
this.messageService.addSuccessMsg(event.body['successMsg']);
}
}
})
}
}
This is my app.main
which reads the data 这是我的
app.main
,它读取数据
export class AppComponent implements OnInit {
successMessages = [];
constructor(private messageService: MessageService) { }
ngOnInit(): void {
this.messageService.successMessages$.subscribe(
message => {
console.log(message);
setTimeout(() => {
this.successMessages.push(message);
});
});
}
}
With some console statements I can see that data is getting into the messageService.setMsgs(...)
private method correctly but it's never reaching my app.main
like it does when I send messages via components. 通过一些控制台语句,我可以看到数据正确地进入了
messageService.setMsgs(...)
私有方法,但它从未到达我的app.main
就像通过组件发送消息时一样。 There are no error messages or anything, it just doesn't work. 没有错误消息或任何东西,只是不起作用。
One thing I did notice is in the MessageService.setMsgs(..)
I put a console statement for successMessageList
. 我注意到的一件事是在
MessageService.setMsgs(..)
我为successMessageList
了一条控制台语句。 When i add a message via a component I get an output that looks like this ( NOTE the observers: Array(1)
vs observers: Array(0)
) 当我通过组件添加消息时,我得到的输出看起来像这样( 注意
observers: Array(1)
vs observers: Array(0)
)
Subject {_isScalar: false, observers: Array(1), closed: false, isStopped: false, hasError: false, …}
But when I add a message via the HttpInterceptor
I get this 但是当我通过
HttpInterceptor
添加一条消息时,我得到了
Subject {_isScalar: false, observers: Array(0), closed: false, isStopped: false, hasError: false, …}
Any ideas on whats going on would be greatly appreciated! 关于发生了什么的任何想法将不胜感激!
I am using Angular 5 我正在使用Angular 5
This issue was 100% user error. 此问题是100%用户错误。 In my
app.main
component I was declaring the messageService
as a provider
in the @Component
so the service was not a shared singleton like i was expecting it to be. 在我的
app.main
组件中,我在@Component
中将messageService
声明为provider
,因此该服务不是我期望的共享单例。 After i removed that everything works as expected. 我删除后,一切正常。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.