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、コンポーネント経由でメッセージを送信するときのようにデータが到達することはありません。エラーメッセージなどはありません。動作しません。

私が気づいたことの 1 つは、MessageService.setMsgs(..)I put a console statement forsuccessMessageListです。コンポーネントを介してメッセージを追加すると、次のような出力が得られます ( vsに注意してください)observers: Array(1)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宣言していたので、サービスは期待していたような共有シングルトンではありませんでした。削除した後、すべてが期待どおりに機能します。messageServiceprovider@Component

于 2017-11-21T17:50:35.643 に答える