Question

我有一条消息Observable，用于在页面上显示通知。我遇到的问题是在消息组件初始化之前页面加载时发生错误意味着Observable尚未订阅，因此在我尝试发出错误时未定义。

export class MessageService {
    public messagesSource: Observable<IMessage>;
    private messagesObserver: any;

    constructor() {
        console.log('MessageService constructor called');
        this.messagesSource = new Observable(observer => {
            console.log('MessageService observer called');
            this.messagesObserver = observer;
        }).share();
    }

    public show = (message: IMessage) => {
        if (this.messagesObserver) {
            this.messagesObserver.next(message);
        } else {
            console.error('this.messagesObserver is not initialised', this.messagesObserver);
        }
    }
}


export class MessagingComponent {
    public messages: IMessage[] = [];

    constructor(private messageService: MessageService) {
        console.log('messaging component constructor');
        this.messageService.messagesSource.subscribe(message => this.setMessage(message));
    }
}

// and within my HttpService:
private errorHandler = (error: Response): Observable<any> => {
    const err: string = error.text() || JSON.stringify(error);
    console.error('App error occurred:', err);
    this.messageService.show({ content: err, level: 'danger'});
    return Observable.from([null]);
}

正常操作日志：

导航至http://localhost:8090/

MessageService构造函数名为

消息传递组件构造函数

MessageService观察者调用

Angular正在开发模式下运行。

当解析器出错时：

导航至http://localhost:8090/jobs

MessageService构造函数名为

获取http://localhost:7777/api/jobs 401（未经授权）

发生应用程序错误：授权失败，无效的承载令牌。

this.messagesObserver未初始化为undefined

消息传递组件构造函数

MessageService观察者调用

Angular正在开发模式下运行。

因此，我需要一种方法让new Observable(observer)立即创建Observer，以便它不会被定义，并且当组件准备好订阅时，消息不会丢失和发出。

Answer 1

您需要创建BehaviorSubject，

观察者可以订阅主题以接收最后一个（或初始值和所有后续通知。

如果您想缓冲所有回复，也可以使用ReplaySubject。

希望这会有所帮助!!

立即创建Observable并排队，直到订阅

1 个答案: