0

我创建了一个MessageService我将数据推送到其中，然后由我读取app.main以向用户显示这些消息的方法。当我在组件中使用此服务时，它工作正常。我想要做的是将其提升到HttpInterceptor将监视所有HttpResponse服务器消息并将它们推送到服务以供用户显示的级别。

这是我的服务：

@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);
  }
}

这是我的 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']);
          }
        }
      })
  }
}

这是我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);
        });
      });
  }
}

通过一些控制台语句，我可以看到数据messageService.setMsgs(...)正确地进入了私有方法，但是app.main当我通过组件发送消息时，它永远不会像我一样到达我的位置。没有错误消息或任何东西，它只是不起作用。

我确实注意到的一件事是在MessageService.setMsgs(..)我为successMessageList. 当我通过组件添加消息时，我得到一个看起来像这样的输出（注意observers: Array(1)vs observers: Array(0)）

Subject {_isScalar: false, observers: Array(1), closed: false, isStopped: false, hasError: false, …}

但是当我通过添加消息时，HttpInterceptor我得到了这个

Subject {_isScalar: false, observers: Array(0), closed: false, isStopped: false, hasError: false, …}

任何关于正在发生的事情的想法将不胜感激！

我正在使用 Angular 5

4

1 回答 1

1

这个问题是 100% 的用户错误。在我的app.main组件中，我将其声明messageService为 a provider，@Component因此该服务不像我期望的那样是共享单例。在我删除后，一切都按预期工作。

于 2017-11-21T17:50:35.643 回答